zoukankan      html  css  js  c++  java
  • 雷哥带你走进Javascript

    javascript复习笔记
    --------------------------------------------
    1.概念
    2.面向对象思想
    3.作用认识
    4.引入方式
    5.执行顺序

    变量
    1)声明方式
    x=10
    用 var声明(可以省略)
    2) 变量的命名规则
    a、不能以数字开头
    b、不能是系统中关键字 [如if switch var 等]
    c、区分大小写
    d、不能以标点符号开头


    注释:
    单行://
    多行:/* */

    消息框:
    1)alert()
    2)confirm()
    3)prompt()

    变量的数据类型(10种)
    首先引入查看数据类型的函数
    a=10;
    typeof(a),a其本身返回的是string类型

    1.字符串
    2.数字
    3.浮点
    4.数组
    5.对象
    6.布尔型
    7.null
    8.undefined
    9.NaN
    10.json

    global对象
    数据类型的转换
    1)转换成数字
    Number();
    2)转抱成字符串
    String()
    4)转换成数字
    parseInt()
    5)转换成浮点数
    parseFloat()
    6)转换成布尔型
    Boolean()
    7)转换成对象
    8)Object()
    9)eval()


    确定元素的位置
    1.document.getElementById()
    2.document.getElementsByTagName();
    3.document.getElemnetsByName();

    运算符
    1)in
    2)new
    3)++,--
    4)arr instanceof Array
    arr=new Array(3,4,5);
    if(arr instanceof Array){
    alert("yes");
    }else{
    alert("no");
    }


    json字符串转成json对象
    eval("("+"{'name':'zhilei','age':'10'}"+")")


    流程控制
    1.if(){}
    2.while(){}
    3.switch(){}
    4.for
    5.forin

    函数
    1)声明
    2)参数
    3)返回值


    对象篇
    1)Array
    2)Boolean
    3)Date
    4)Math
    5)String
    6)RegExp
    7)Functions
    8)Events
    9)定时器与超时器对象
    setInterval();
    clearInterval()
    超时器
    setTimeout()
    clearTimeout();

    1.数组对象
    属性:
    length, instanceOf Array;
    方法:
    1).concat()
    2).join()
    3).push()
    4).pop()
    5).reverse()
    6).shift()
    7).slice()
    8).sort()
    9).splice()
    10).toSource()
    11).toString()
    12).toLocaleString()(x)忽略
    13).unshift()
    14)filter()


    总结:将数组转换成字符串的方法
    arr.join();
    arr.toString();

    2.布尔对象
    new Boolean();
    假值有哪些:(七种值)
    1)0,false,undefined,NaN,"",null

    3.日期对象
    new Date();
    1)实例化日期对象
    time=new Date()

    2)从 Date 对象返回一个月中的某一天 (1 ~ 31)。
    time.getDate()

    3)从 Date 对象返回月份 (0 ~ 11)。
    time.getMonth() ps日常使用的时候要加1

    4)从 Date 对象以四位数字返回年份。
    time.getFullYear();
    time.getYear() 这个已经不用了

    5)返回 Date 对象的小时 (0 ~ 23)。
    time.getHours();

    6)返回 Date 对象的分钟 (0 ~ 59)。
    time.getMinutes()

    7)返回 Date 对象的毫秒(0 ~ 999)。
    time.getSeconds()

    8)返回 Date 对象的毫秒(0 ~ 999) 秒单词要小写
    time.getMilliseconds()

    9)从 Date 对象返回一周中的某一天 (0 ~ 6)。
    time.getDay();

    4.数学对象 (直接是一个对象,不需要实例化)
    常用的属性:[数学对象的属性都是大写的]
    1)E
    2)PI

    常用的方法:
    2)进一值
    ceil()
    3)舍一
    floor()
    4)取两个值最大值
    max(3,5)
    5)取最小值
    min(4,5)
    6)返回0-1的随机数
    random( )


    5.number对象
    1)Number 对象是原始数值的包装对象。
    2)Number()
    3)当Number() 和运算符 new 一起作为构造函数使用时,它返回一个新创建的 Number 对象。如果不用 new 运算符,把 Number() 作为一个函数来调用,它将把自己的参数转换成一个原始的数值,并且返回这个值(如果转换失败,则返回 NaN)。

    属性:
    返回最大值
    Number.MAX_VALUE

    返回最小值
    Number.Min_VALUE

    返回并不一个数字
    Number.NaN

    判断一个数是不是一个数字
    isNaN()

    方法:
    1)将数字转换为字符串
    toString()
    例:
    <script>
    var num=10;
    var aa=Number.toString(num);
    alert(typeof(aa));
    </script>

    2)把数字转换为字符串,结果的小数点后有指定位数的数字。
    tofixed

    例子:将数据对象转为字符串,并指定小数保留1位
    <script type="text/javascript">
    var num = new Number(13.37);
    document.write (num.toFixed(1)) //代表小数保留一位
    </script>


    6.字符串对象
    声明字符串对象就是声明一个字符串的变量
    new String("aaa")="aaaaaa";
    1.如果有new的话,则会成一个新的字符串来处理字符串
    2.如果没有的话,则会转换数据类型

    属性:
    字符串的长度
    length

    方法:
    1)创建锚点
    anchor()
    var str="hello";
    document.write(str.anchor("test"));
    // 说白了这个功能就是将字符串作为a链接的innerHTML而anchor()括号时面的值就是a链接的name值

    2)用大号字体显示字符串。
    big();
    var str="hello";
    document.write(str.big());

    3)显示闪动的字符串
    str.blink();
    本质就是给字符串加标签<blink>str</blink>

    4)显示粗体
    str.bold();

    5)返回查指定位置的字符(指针从零开始)
    str.charAt(3);

    6)返回字符串指定位置的unicode编码
    str.charCodeAt();

    7)字符串连接
    str.concat();

    8)以打印机文本显示字符串
    str.fixed();

    9)给字符串加指定的颜色 (注意:全小写)
    str.fontcolor();
    相当于<font color="#f00">hello</font>

    10)给字符串指定大小
    str.small();
    操作后字符中加了标签<small>hello</small>

    11)索引字符串
    说明:返回的一个索引下标
    str.indexOf("索引值","从哪里开始")

    12)将字符串转为斜体
    str.italics();
    结果在这个字符串上面加一个标签<i>str</i>

    13)将字符串显示为链接
    在这个字符串上面加<a href="undefined">hello</a>

    14)用本地的顺序来比较字符串
    str.localeCompare(target)

    16)显示小字体
    str.small()

    7)字符串分割
    str.split('',num);

    18)将字符串显示为下标
    str.sub(); 其实就是加一个标签<sub>hello world</sub>

    19)从起始索引提出字符串中指字数止的字符
    str.substring();
    str.slice();

    20)大小写转换
    1)全转换大写
    toUpperCase()
    2)全转为小写
    toLowerCase()
    21.转换成字符串
    toString()=String("");

    正则处理字符串
    1)匹配
    match()
    2)查找
    search()
    3)替换
    replace()

    7正则对象(RegExp)
    功能:处理字符串
    1)创建正则对象语法
    new RegExp(pattern,attributes)
    转义符:

    0)常用原子
    .
    w与W包含数字,字母与下划线
    d与D
    s与S
    与B


    f

    v
    [abc]
    [a-zA-Z]
    [^a]
    [0-9]


    1)常用元字符
    +
    *
    ?
    {x}
    {x,y}
    {x,}
    n^
    n$

    2)模式修正符
    i :忽略大小写
    m :执行多行匹配
    g :执行全局匹配

    ()用法

    支持正则表达式字符串对象的方法:
    返回第一个与 regexp 相匹配的子串的起始位置
    search()
    1)查找符合规则的第一个项的下标
    2)返回的是一个数字

    match()
    1)返回值
    1)如果是用字符串作为直接查找的内容的话,则会返回一个字符串,且是符合的第一个.
    2)如果用正则查找的话,而没有加"g" 全局标志的话,则也会返回符合正则的第一个字符串.
    3)如果用正则查找且用全局模式"g" 则会返回一个字符串的数组.

    replace()
    1)返回一个新的字符串
    2)如果不加全局替换的话则会替换查找到的第一个
    3)可用字符串来查找
    4)也可用正则来查找
    5)也是复制性的操作,并不会将原来的字符串给更改


    split()
    [这个只是复制性操作,并不非改变原字符串,且分割后是一个数组对象]
    1)可以直接用字符串分割,如果给一个""空的字符串,则会将每一个字母都分开
    2)也可用正则来分割
    3)也可用有第二个参数就是显示的个数

    实例:
    1)url匹配
    2)mail匹配

    8)函数对象其实就是global对象
    全局对象与函数可用于所有的内建javascript对象
    顶层函数(全局函数)
    1)将js字符串作为脚本来执行[相当于去掉string外面的单双引号]
    eval()
    如果没有表达式的话则要加上()相当于表达式

    2)isNaN()

    3)Number()

    4)String()

    5)parseFloat()

    6)parseInt()

    顶层属性
    1)NaN
    2)undefined


    9事件句柄或者是事件对象

    1)焦点事件
    onblur
    onfocus

    2)页面加载事件
    1.onload(事件会在页面或者是图片加载完成后立即执行)
    支持标签:<body>, <frame>, <frameset>, <iframe>, <img>, <link>, <script>
    支持该事件JavaScript: 对象:
    image, layer, window
    例子:
    onload 当页面加载完成的时候执行相应的代码
    document.body.onload=function(){
    alert("aa");
    }
    ununload支持标签
    unbeforeunload
    1.body
    2.frameset

    onbeforeunload实例:
    document.getElementById("body").onbeforeunload=function(){
    return confirm('你确认要离开这个页面?')
    }

    1.onresize 当浏览器大小发生改变的时候执行的动作
    2.onscroll

    对象内容发生改变
    onchange
    事件是没有()的

    3)键盘事件
    onkeydown
    onkeypress


    4)鼠标事件
    1.onmousedown (鼠标按下)
    2.onmousemove (鼠标移动)
    3.onmouseout (现在改用mouseleave,能实现绝对离开)
    4.onmouseover (现在改用mouseenter)
    5.onmouseup (鼠标抬起事件)
    6.onclick (点击一个操作对象)
    7.ondblclick (并不常用)

    5)表单事件
    ->直接操作表单对象
    onreset
    onsubmit

    ->操作表单内input,textarea对象
    onselect
    1.(支持事件的html标签 input textarea)
    2.支持该事件的js对象是window


    事件对象方法:
    1.focus()
    2.blur
    3.select()
    4.submit()
    5.reset()
    6.click

    阻止标签默认的方法
    a标签
    form表单

    DOM对象:
    event事件监听器对象:
    属性:
    关于鼠标:
    1)获取发生鼠标事件时候相对于浏览器的位置
    event.clientY,event.clientX
    2)判断鼠标哪个键被点击
    0左 1中 2右
    3)相对于屏幕鼠标的位置
    screenX screenY

    关于键盘:
    1)返回键被按下后的unicode码 ps这值并不包含shift alt 等键
    event.keyCode
    2)判断一此keyCode没有返回码的
    1.evnet.shiftKey
    2.altKey
    3.ctrlKey
    4.metaKey[苹果专有]
    5.relatedTarget [只有onmouseover 与onmouseout 能用本身功能并不大]

    ----------------------------------------------------------
    浏览器对象(BOM):
    功能:让js有操作窗口的能力,其是最外层的对象,只不过可以省略而已。

    一.window对象
    二.Navigator
    三.Screen
    四.History
    五.Location

    ===========================
    1.window对象[窗口对象只有打开的时候才会产生一个对象]

    Window 对象表示浏览器中打开的窗口。
    如果文档包含框架(<frame> 或 <iframe> 标签),浏览器会为 HTML 文档创建一个 window 对象,并为每个框架创建一个额外的 window 对象。

    属性:
    1)获取浏览器的高度与宽度
    a.对于Internet Explorer、Chrome、Firefox、Opera 以及 Safari:
    获取窗口的高
    window.innerHeigiht
    获取窗口的宽
    window.innerWidth

    对于Internet Explorer 8、7、6、5:
    # window.document.documentElement.clientHeight
    # window.document.documentElement.clientWidth
    # document.body.clientWidth;
    # document.body.clientHeight;
    # 如果要用的话 ,我们则要选择第一种 最为方便,且最符合现在的浏览器标准

    页面中三个关键高度
    1.滚动出去的高度
    document.documentElement.scrollTop
    2.浏览器的大小(除了上下的菜单栏部分)
    1).window.innerHeight,window.innerWidth
    2).document.documentElement.clientWidth/clientHeight
    3).谷歌的话则要用document.body.clientWidth/clientHeight
    3.页面文档的总高度,屏幕总高度
    document.documentElement.scrollHeight

    2)判断窗口是否已经关闭
    closed
    3)frmaes,top
    4)innerHiehgt
    5)innerWidth

    只读引用的属性:
    1)document
    2)navigator
    3)history
    4)location
    5)screen

    方法:
    1)定时与超时器(返回一个对象)
    setInterval()
    clearInterval()
    setTimeout()
    clearTimeout()
    2)消息框
    alert()
    confirm()
    prompt()

    Navigator对象:
    属性:
    userAgent

    历史对象:
    属性:length

    方法:
    1.back()=go(-1);
    2.go()
    3.forward()

    screen屏幕对象:
    属性:
    width
    height
    availWidth
    availHeight

    location对象:
    属性:
    1)bash
    2)host
    3)hostname
    4)href
    location.href="http://www.baidu.com"=location="http://www.jd.com";
    5)pathname
    6)port
    7)protocal
    8)search

    方法:(三个方法的功能差不多)
    1)分配一个新的文档,也会替换当前的文档
    assign()

    2)重新加载当前文档(也就是刷新)
    reload()

    3)找一个新的文档来替换当前的文档
    replace()


    -----------------------------------------------------------
    文档对象(DOM)
    1)Document (document对象)
    2)Element (元素对象)
    4)Events (事件对象) 事件监听对象

    1)document对象的集合:
    1.document.forms
    2.selectobj.options
    3.document.images
    4.document.links
    5.document.anchors
    6.tabojg.rows
    7.tabojb.cells

    2)非集合的属性:

    1.body
    2.cookie
    3.domain
    document.domain=location.host=location.hostname
    4.lastModified
    5.referrer
    6.title
    7.URL
    document.URl=location.href [两者值是一样的]
    方法:
    1.getElementById()
    2.getElementsByTagName()
    3.getElementsByClassName()
    4.getElementsByName()
    5.document.write();

    正规属性与非正规属性:

    元素对象:
    正规属性 对象可以直接访问
    1.id
    2.className
    3.title
    4.style

    通过方法来获取或者设置所有的属性包括非正规属性
    1.获取
    obj.getAttribute() ,如果所有的属性的话getAttributs
    2.设置
    obj.setAttribute()

    常规属性:
    1.element.clientHeight
    2.element.clientWidth

    元素对象的js属性:
    innerHTML
    outerHTML
    textContent
    tagName

    ajax对象
    AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。

    1.创建对象
    xhr=new XMLHttpRequest
    2.常用方法
    1)xhr.open("post/get","url","true/false")
    说明:第三个参数代码是同步还是异步
    2)xhr.send();
    说明:发送请求
    3)如果发送的是表单的数据的话则发送一个请求的头信息
    xhr.setRequestHeader("content-type","application/x-www-form-urlencoded");
    4)监听方法:
    onreadystatechange=function(){
    if(xhr.readyState==4 && xhr.status==200){
    obj.innerHTML=xhr.responseText
    }
    }

    2)响应
    xhr.reponseText

    3)

    属性:
    xhr.status (200 or其它的)
    xhr.readyState(0,1,2,3,4)
    0: 请求未初始化
    1: 服务器连接已建立
    2: 请求已接收
    3: 请求处理中
    4: 请求已完成,且响应已就绪

  • 相关阅读:
    windows安全实验
    ping 命令的禁止 以及密码的攻破
    网络基础
    html 中间件
    js php BurpSuite v2.1
    网页标签,PHPstudy
    说说text_line_orientation算子的巧妙应用
    说说C#进行数字图像处理的方法
    微信张小龙产品30条
    说说几个常用的阈值分割算子
  • 原文地址:https://www.cnblogs.com/leigepython/p/8595901.html
Copyright © 2011-2022 走看看