JavaScript

JavaScript脚本
使用:
    <script language="javascript">
        。。。。。js代码
    </script>

引入外部js文件:
    <script language="javascript" src="1.js"></script>

直接嵌入到HTML标签中:
    <input type="button" value="SayHello" onclick="javascript:alert('Hello1');alert('Hello2');"/>

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

标识符:
    第一个字符必须是字母、下划线(_)或美元符号($),其他字符可以使用字母、数字、下划线或美元符号
    标识符不能和JavaScript的关键字同名
    JavaScript中标识符是区分大小写的

变量:
    var age = 10;
    var name = "jack"; //字符串双引号可以
    var ename = ‘KING’; //字符串单引号也可以
    var empno=7369,sal=800,deptno=10; //一行上可以同时定义多个变量
    var job; //先声明
    job = "CEO"; //再赋值
    var deptname; //如果只声明没有赋值则是undefined

    <script language="javascript">
        var ename1 = "SMITH";//全局变量
        function testVar1(){//这是一个函数
            var ename2 = "KING";//局部变量
            dname = "ACCOUNT"; //不带有var关键字的变量一定是全局变量
        }
    </script>

函数初步:
    第一种方式:
    function 函数名(形式参数列表){ //形参是局部变量
        函数体由js语句构成;
    }
    调用函数:
      函数名(实参);

    第二种方式:
    函数名 = function(形式参数列表){
        函数体由js语句构成;
    }
    注:参数个数不匹配也可以调用,参数多或少都可以

<form name="form1">
<input type="text" name="username"/> 
<!--
要获取form表单中的一个标签的value? form的名字.标签的名字.value
-->
<input type="button"value="sayHello"onclick="sayHello(form1.username.value);"/>
</form>

function sayHello(username){
    //alert(username + ",你好!");
    //document是JS中的DOM的顶层对象
    //document内置对象中有一个write方法,可以向浏览器输出HTML代码。
    //document.write(username + ",你好!");
    document.write("<center><font color='blue' size='7'>" + username + ",你好!</font></center>");
}

//JS中的函数也可以有返回值,也可以没有。
//JS函数最后可以编写return语句,也可以不写。
function validateName(username){
    //字符串length属性用来获取字符串的长度。
    if(username.length<6){
        return false;
    }
        return true;
}

<!--
失去焦点事件:blur
失去焦点事件句柄:onblur
以下程序中的this表示当前对象,当前对象是input框。
this.value是input框的值。
-->
<input type="text" name="username" onblur="alert(validateName(this.value)?'合法':'不合法');"/>

<script language="javascript">
    /*
    js中函数声明的时候,不仅是一个函数的声明,还是一种类型的定义。
    JS中类的定义和构造方法于一体。
    */
    //这里的Dept不但是一个函数名,还是一个类名。
    Dept = function(deptno,dname,loc){
        alert("能执行吗?");
        //this表示当前对象。
        //属性
        this.deptno = deptno;
        this.dname = dname;
        this.loc = loc;
        //动作
        this.print = function(){
            document.write("部门编号:" + this.deptno + ",部门名:" + this.dname + ",部门地理位置:" + this.loc);
        }
        alert("end-->能执行吗?");
    }
    //创建对象
    var d1 =  new Dept(10,"SALES","NEW YORK");
    d1.print();// 调用对象的方法

    alert(d1.deptno);//调用对象的属性
    alert(d1.dname);
    alert(d1.loc);

    //这里不会创建对象,这只是普通方法调用。
    Dept(20,"MYSALES","BEIJING");
</script>

数据类型:
    JavaScript中有5种数据类型:4种原始类型(基本数据类型)Undefined、Boolean、Number、String。
    1种引用数据类型—Object,自定义的函数也是一种引用数据类型,这个类默认继承Object类型。所以Function也属于引用数据类型。

    typeof运算符的运算结果一定是"String"类型
    对一个值使用typeof操作符可能返回下列某个字符串:
        "undefined"——如果这个值未定义;
        "boolean"——如果这个值是布尔值;
        "string"——如果这个值是字符串;
        "number"——如果这个值是数值;
        "object"——如果这个值是对象或null;
        "function"——如果这个值是函数;

    语法有三种写法:
    1.typeof 变量名
    2.typeof(变量名)
    3.typeof 函数名

    //Object类是一种引用数据类型
    //Object是JS中内置的。
    //Object既是一个函数的名字,也是一个类名。
    var o = new Object();
    alert(typeof(o)); //"object"

    //User类中有一个属性username
    User = function(a){
    this.username = a;
    }
    o = new User("SMITH");
    alert(typeof(o)); //"object"
    alert(typeof(User)); //"function"

    JavaScript中所有类型的值都有与这两个Boolean值等价的值。
    要将一个值转换为其对应的Boolean值,可以调用类型转换函数Boolean()
    例如:
    var message = 'Hello World';
    var messageAsBoolean = Boolean(message);

    数据类型         转换为true的值                          转换为false的值
    Boolean                  true                                            false
    String              任何非空字符串                           ""(空字符串)
    Number           任何非零数字值(包括无穷大)         0和NaN
    Object             任何对象                                            null
    Undefined          n/a(不适用)                                 undefined

    v1 = Infinity; //无穷大

    //关于if语句 和java语法结果相同。区别在于if(这里的数据如果不是Boolean
    //类型,系统会自动调用Boolean函数进行类型的转换)
    var a = "ABCDEF";
    if(a){
        alert(a);
    }else{
        alert("空字符串");
    }

    NaN与任何值都不相等,包括NaN本身
    alert(NaN == NaN);//false
    
    重点:isNaN函数
    语法:isNaN(变量)  判断该变量是否是一个数字。
    "is not a number"
    isNaN的运算结果是true、false
    true:不是一个数字
    false:是一个数字
    alert(isNaN(NaN));   //true
    alert(isNaN(10));    //false(10是一个数值)
    alert(isNaN("10"));  //false(可能被转换为数值10)
    alert(isNaN("blue"));//true(不能被转换为数值)
    alert(isNaN(true));  //false(可能被转换为数值1)

    Number类型包括以下值:
    整数(0,1,2,3.....)
    浮点数(1.0,2.0,3.0.....)
    NaN (这就是一个值,属于Number类型,表示"不是一个数字",Not a Number)
    Infinity (这就是一个值,属于Number类型,表示无穷大)
    //除数是0的时候运算结果是无穷大Infinity

    有3个函数可以把非数值转换为数值:Number()、parseInt()和parseFloat()。
    第一个函数,即转型函数Number()可以用于任何数据类型,
    而另外两个函数则专门用于把字符串转换成数值。
    这3个函数对于同样的输入会返回不同的结果。

    Number()函数的转换规则如下:
        如果是Boolean值,true和false将分别被替换为1和0
        如果是数字值,只是简单的传入和返回
        如果是null值,返回0
        如果是undefined,返回NaN
        如果是字符串,遵循下列规则:
       如果字符串中只包含数字,则将其转换为十进制数值,即"1"会变成1,"123"会变成123,而"011"会变成11(前导的0被忽略)
        如果字符串中包含有效的浮点格式,如"1.1",则将其转换为对应的浮点数(同样,也会忽略前导0)
        如果字符串中包含有效的十六进制格式,例如"0xf",则将其转换为相同大小的十进制整数值
        如果字符串是空的,则将其转换为0
        如果字符串中包含除了上述格式之外的字符,则将其转换为NaN
       如果是对象,则调用对象的valueOf()方法,然后依照前面的规则转换返回的值。如果转换的结果是NaN,则调用对象的toString()方法,然后再依次按照前面的规则转换返回的字符串值。
        var num1 = Number("Hello World");   //NaN
        var num2 = Number("");              //0
        var num3 = Number("000011");        //11
        var num4 = Number(true);            //1

    由于Number()函数在转换字符串时比较复杂而且不够合理,因此在处理整数的时候更常用的是parseInt()函数。
    parseInt()函数在转换字符串时,更多的是看其是否符合数值模式。它会忽略字符串前面的空格,直至找到第
    一个非空格字符。如果第一个字符串不是数字字符或者负号,parseInt()会返回NaN;也就是说,用parseInt()
    转换空字符串会返回NaN。如果第一个字符是数字字符,praseInt()会继续解析第二个字符,直到解析完所有
    后续字符或者遇到了一个非数字字符。
    例如,"1234blue"会被转换为1234,"22.5"会被转换为22,因为小数点并不是有效的数字字符。

    如果字符串中的第一个字符是数字字符,parseInt()也能够识别出各种整数格式(即十进制、八进制、十六进制)。
    为了更好的理解parseInt()函数的转换规则,下面给出一些例子

    var num1 = parseInt("1234blue");    //1234
    var num2 = parseInt("");                   //NaN
    var num3 = parseInt("0xA");            //10(十六进制)
    var num4 = parseInt("22.5");           //22
    var num5 = parseInt("070");            //56(八进制)
    var num6 = parseInt("70");              //70

    var num7 = parseInt("10",2);           //2(按二进制解析)
    var num8 = parseInt("10",8);           //8(按八进制解析)
    var num9 = parseInt("10",10);         //10(按十进制解析)
    var num10 = parseInt("10",16);       //16(按十六进制解析)
    var num12 = parseInt("AF",16);      //175

    与parseInt()函数类似,parseFloat()也是从第一个字符(位置0)开始解析每个字符。而且也是一直解析到
    字符串末尾,或者解析到遇见一个无效的浮点数字字符为止。也就是说,字符串中的第一个小数点是有效的,
    而第二个小数点就是无效的了,因此它后面的字符串将被忽略。例如,"22.34.5"将会被转换成22.34。
    parseFloat()和parseInt()的第二个区别在于它始终都会忽略前导的零。由于parseFloat()只能解析十进制值,
    因此它没有用第二个参数指定基数的用法。

    var num1 = parseFloat("1234blue");   //1234
    var num2 = parseFloat("0xA");           //0
    var num3 = parseFloat("22.5");          //22.5
    var num4 = parseFloat("22.34.5");     //22.34
    var num5 = parseFloat("0908.5");      //908.5

    String类型用于表示由零或多个16位Unicode字符组成的字符序列,即字符串。字符串可以由单引号(')或双引号(")表示
    任何字符串的长度都可以通过访问其length属性取得
    字符串有 prototype属性,用来给字符串类型动态扩展属性和方法
    //给字符串类多态扩展属性和方法,该属性和方法可以作用到所有字符串对象上。
    String.prototype.trim = function(){
        return this.replace(/^\s+/,"").replace(/\s+$/,"");
    }
    把一个值转换为一个字符串有两种方式。第一种是使用几乎每个值都有的toString()方法。
    数值、布尔值、对象和字符串值都有toString()方法。但null和undefined值没有这个方法

    多数情况下,调用toString()方法不必传递参数。但是,在调用数值的toString()方法时,可以传递一个参数:输出数值的基数
    var num = 10;
    alert(num.toString());      //"10"
    alert(num.toString(2));     //"1010"
    alert(num.toString(8));     //"12"
    alert(num.toString(10));    //"10"
    alert(num.toString(16));    //"a"

    在不知道要转换的值是不是null或undefined的情况下,还可以使用转型函数String(),这个函数能够将任何
    类型的值转换为字符串。String()函数遵循下列转换规则:
        如果值有toString()方法,则调用该方法(没有参数)并返回相应的结果
        如果值是null,则返回"null"    
        如果值是undefined,则返回"undefined"

    Object的每个实例都具有下列属性和方法:
        constructor——保存着用于创建当前对象的函数
        prototype--------给类型动态扩展属性(类级别),将作用到所有对象上。(类名.)方式访问
        hasOwnProperty(propertyName)——用于检查给定的属性在当前对象实例中(而不是在实例的原型中)是否存在。其中,作为参数的属性名(propertyName)必须以字符串形式指定(例如:o.hasOwnProperty("name"))
        isPrototypeOf(object)——用于检查传入的对象是否是另一个对象的原型
        propertyIsEnumerable(propertyName)——用于检查给定的属性是否能够使用for-in语句来枚举
        toString()——返回对象的字符串表示
        valueOf()——返回对象的字符串、数值或布尔值表示。通常与toString()方法的返回值相同。

     Object类是JS中内置的
     //创建Object对象
     var o1 = new Object();

     //JS中的对象都有toString方法
     alert(o1);
     alert(o1.toString());

     //关于constructor属性,用来获取创建该对象的构造函数
     alert(o1.constructor);

     //关于prototype属性,用来给类型动态扩展属性以及方法
     Emp = function(ename,sal){
         this.ename = ename;
         this.sal = sal;

         /**/
         this.toString = function(){
             return this.ename + "--->" + this.sal;
         }
     }

     var e1 = new Emp("KING",5000);

     //Error
     //e1.printInfo();

     //动态扩展
     Emp.prototype.printInfo = function(){
         document.write(this.ename + "," + this.sal);
     }

     //调用方法
     e1.printInfo();
     alert(e1);
     alert(e1.toString());
     alert(e1.constructor);

运算符:
 
算术运算符     
    +       (加法) 将两个数相加。 
    ++     (自增) 将表示数值的变量加一(可以返回新值或旧值)。 
    -        (求相反数,减法) 作为求相反数操作符时返回参数的相反数。作为二进制操作符时,将两个数相减。 
    --       (自减) 将表示数值的变量减一(可以返回新值或旧值)。 
    *        (乘法) 将两个数相乘。 
    /        (除法) 将两个数相除。 
    %      (求余) 求两个数相除的余数。 

字符串运算符     
    +       (字符串加法) 连接两个字符串。 
    +=     连接两个字符串,并将结果赋给第一个字符串。 

逻辑运算符     
    &&     (逻辑与) 如果两个操作数都是真的话则返回真。否则返回假。 
     ||       (逻辑或) 如果两个操作数都是假的话则返回假。否则返回真。 
     !        (逻辑非) 如果其单一操作数为真,则返回假。否则返回真。 

位运算符     
    &       (按位与) 如果两个操作数对应位都是 1 的话则在该位返回 1。 
    ^        (按位异或) 如果两个操作数对应位只有一个 1 的话则在该位返回 1。 
    |         (按位或) 如果两个操作数对应位都是 0 的话则在该位返回 0。 
    ~        (求反) 反转操作数的每一位。 
    <<      (左移) 将第一操作数的二进制形式的每一位向左移位,所移位的数目由第二操作数指定。右面的空位补零。 
    >>      (算术右移) 将第一操作数的二进制形式的每一位向右移位,所移位的数目由第二操作数指定。忽略被移出的位。 
    >>>    (逻辑右移) 将第一操作数的二进制形式的每一位向右移位,所移位的数目由第二操作数指定。忽略被移出的位,左面的空位补零。 

赋值运算符     
    =          将第二操作数的值赋给第一操作数。 
    +=        将两个数相加,并将和赋给第一个数。 
    -=         将两个数相减,并将差赋给第一个数。 
    *=         将两个数相乘,并将积赋给第一个数。 
    /=         将两个数相除,并将商赋给第一个数。 
    %=       计算两个数相除的余数,并将余数赋给第一个数。 
    &=        执行按位与,并将结果赋给第一个操作数。 
    ^=         执行按位异或,并将结果赋给第一个操作数。 
    |=          执行按位或,并将结果赋给第一个操作数。 
    <<=       执行左移,并将结果赋给第一个操作数。 
    >>=       执行算术右移,并将结果赋给第一个操作数。 
    >>>=     执行逻辑右移,并将结果赋给第一个操作数。 

比较运算符     
    ==     如果操作数相等的话则返回真。 
    !=      如果操作数不相等的话则返回真。 
    >       如果左操作数大于右操作数的话则返回真。 
    >=     如果左操作数大于等于右操作数的话则返回真。 
    <       如果左操作数小于右操作数的话则返回真。 
    <=     如果左操作数小于等于右操作数的话则返回真。 

特殊运算符     
    ?:     执行一个简单的"if...else"语句。 
    ,       计算两个表达式,返回第二个表达式的值。 
    delete     允许你删除一个对象的属性或数组中指定的元素。 
    new        允许你创建一个用户自定义对象类型或内建对象类型的实例。 
    this         可用于引用当前对象的关键字。 
    typeof     返回一个字符串,表明未计算的操作数的类型。 
    void        该操作符指定了要计算一个表达式但不返回值。 

    对字符串是不能进行乘法运算的,"a" * "b" 是不合法的,但是,在可能的情况下,
    javascript会把表达式转换成正确的类型,因此,表达式 "3" * "5" 是合法的,javascript将字符串转
    换成数字执行运算,结果返回的是数字15,而不是字符串"15
    关于+运算符,只要+两边的算子都是数字则做加法运算,只要+两边的算子其中有一个是字符串类型则做字符串连接运算
    注意运算符的结合性,有些运算符从左到右的结合性;有些从右到左结合性。
    例如:w = a + b + c 等同于 w = (a + b) + c;
    Var c = 10;  w = a = b = c 等同于 w= ( a = ( b = c ));
    在javascript中,只有一种数字类型,那就是浮点类型,所有的数字都是浮点类型。
    由于所有的数都是浮点数,除法的结果都是浮点数,5 / 2 = 2.5 ;除数为0的结果为正负无穷;0/0为NaN

    等同运算符(= =)和全同运算符(= = =)的区别
        (一)、"=="等同运算符:比较2个运算数,返回一个布尔值。比较数值、字符串、布尔值使用的都是量值。当且仅当两个变                  量存放的值相等的时候,他们才相等。比较对象、数组、函数的时候,使用的是引用,只有2个变量引用的是同一个对                  象时,他们才是相等的。两个不同的数组是完全不同的,即使他们具有完全相同的元素。对于存放对象、数组、函数的                引用的变量来说,只有当他们引用的是同一个对象、数组、函数的时候,他们才相等。注意应遵循的原则:
                  当两个运算数的类型不同时:将他们转换成相同的类型,
                       1)一个数字与一个字符串,字符串转换成数字之后,进行比较。
                       2)true转换为1、false转换为0,进行比较。
                       3)一个对象、数组、函数 与 一个数字或字符串,对象、数组、函数转换为原始类型的值,然后进行比较。(先使用valueOf,如果不行就使用toString)
                       4)其他类型的组合不相等。
                  当两个运算数类型相同,或转换成相同类型后:
                       1)2个字符串:同一位置上的字符相等,2个字符串就相同。
                       2)2个数字:2个数字相同,就相同。如果一个是NaN,或两个都是NaN,则不相同。
                       3)2个都是true,或者2个都是false,则相同。
                      4)2个引用的是同一个对象、函数、数组,则他们相等,如果引用的不是同一个对象、函数、数组,则不相同,即使这2个对象、函数、数组可以转换成完全相等的原始值。
                       5)2个null,或者2个都是未定义的(undefined),那么他们相等。
                       "!="非等同运算符:与等同运算符检测的结果相反。
        (二)"= = ="全同运算符:遵循等同运算符的比较规则,但是它不对运算数进行类型转换,当两个运算数的类型不同时,返回                false;只有当两个运算数的类型相同的时候,才遵循等同运算符的比较规则进行比较。"!= = ="非全同运算符与全同运算                  符比较的结果相反。如果两个运算数的类型或者值不同的时候,返回true。
    
    结论:
    ==   a如果可以看做b,不比较数据类型,可以使用该运算符
    === 既比较两个变量中的值,有比较两个变量的数据类型。

    delete 删除一个对象的属性或者数组中特定位置的元素
    delete 对象名称.属性名   //删除对象某个属性
    delete 数组名[下标]  //删除数组中某个元素
    delete 属性 //该语法只适合在with语句中使用

    javascript:void(表达式);
    javascript:void 表达式   //括号可以省略
    <a href="javascript:void(0);" >我虽然是一个超级链接,但是点击我没有任何效果</a>
    <a href="javascript:void(document.form.submit())">点击我可以提交网页中的表单</a>
    href="#"这种形式会整体刷新页面,而 href="javascript:void(0)" 则不会

    未定义的值和定义未赋值的为undefined,null是一种特殊的object,NaN是一种特殊的number

    null和undefined 可以被认为值相等,类型不同


无类型对象(JSON):
    var obj={}; //等同于var obj=new Object();
    var user={
        name:"jack", //定义了name属性,初始化为jack
        favoriteColor:["red","green","black","white"],//定义了颜色喜好数组
        hello:function(){ //定义了方法hello
            alert("hello,"+this.name);
        },
        sex:"male" //定义了性别属性sex,初始化为sex
    }
    //调用user 对象的方法hello
    user.hello();

    使用这种方式来定义对象,还可以使用字符串作为属性(方法)名:
    var u = {"username":"jack",password:"123"};
    alert(u["username"]); 
    alert(u["password"]);
    alert(u.password);


控制语句:
    if(){} 语句
    switch()case 语句
    do{...}while() 语句
    while(){} 语句
    for(){} 语句
    for(...in...){} 语句
    break 和continue 语句
    with() 语句

    使用for…in语句迭代数组
    <script language="javascript">
        var colors = ["红色","绿色","蓝色"];
        // index是数组的索引
        for(var index in colors){
            alert(colors[index]);
        }
    </script>
    for...in 语句是一种精准的迭代语句,可以用来枚举对象的属性
    function Product(pno,pname,price){
        this.pno = pno;
        this.pname = pname;
        this.price = price;
    }

    var p = new Product(100,"西瓜",2.5);
    for(var propertyName in p){
        //alert(typeof(propertyName)); //string
        alert(p[propertyName]);
    }

    with(obj)作用就是将后面的{}中的语句块中的缺省对象设置为obj,那么在其后面的{}语句块中引用obj的方
    法或属性时可以省略"obj."的输入而直接使用方法或属性的名称
    function Employee(empno,ename){
        this.empno = empno;
        this.ename = ename;
        this.work = function(){
            alert(this.ename + " is working!");
        }
    }
    var e = new Employee(7369,"SMITH");

    //不使用with
    alert(e.empno);
    alert(e.ename);
    e.work();
    
    //使用with,可以直接调用对象的属性和方法,而不需要使用obj.属性格式了
    with(e){
        alert(empno);
        alert(ename);
        work();
    }

系统函数eval:
    eval()函数可以把一个字符串当作一个JavaScript表达式一样去执行它。

    eval("var temp = 1;");
    alert(temp);
    案例:
    <html>
        <head>
            <title>执行JS</title>
            <script language="javascript">
            function executeJs(){
                eval(document.getElementById("jsCode").value);
            }
            </script>
        </head>
        <body>
            <textarea cols="60" rows="10" id="jsCode" name="jsCode"></textarea>
            <input type="button" value="执行JS脚本" onclick="executeJs()"/>
        </body>
    </html>


常用内置对象:
    String
        创建字符串对象:
            var s1 = new String("abcdef");
            var s2 = "abcdef";
        属性:
            length 属性 字符串对象通过调用该属性获取字符串长度
            prototype 属性 字符串对象通过调用该属性动态添加属性或方法
        常用函数:
            charAt 返回指定索引处的char值. 
            concat 连接两个字符串生成一个新字符串. 
            indexOf 返回指定字符串在此字符串中第一处出现的索引 
            lastIndexOf 返回指定字符串在此字符串最后一次出现处的索引.  
            link 给此字符串添加热链接.
                document.write("百度".link("http://www.baidu.com"));
            replace 将此字符串中符合正则表达式的子字符串替换成其他字符串. 
                document.write("javaoraclec++javaphp".replace(/java/gi,"我"));
                g :表示全局替换 ;i表示忽略大小写
            search 返回此字符串中符合正则表达式的字符串的下标,如果没有符合的返回-1.  
                document.write("javaoraclec++javaphp".search(/java/gi));
            split 分割字符串. 
                var arrayDate = "2012-10-1".split("-");
                var str = "How are you doing today?";
                document.write(str.split(" ") + "<br />");// 按照空格切分
                document.write(str.split("") + "<br />"); // 按照字符切分
                document.write(str.split(" ", 3));// 按照空格切法,只保留前三个
            substr 截取子字符串
                "abcdef".substr(2); //cdef 从下标2开始
                "abcdef".substr(2,3);  //cde 从下标2开始,截取长度3
            substring 截取子字符串
                "abcdef".substring(2); //cdef 从下标2开始
                "abcdef".substring(2,3); //c 从下标2开始,到下标3结束(不包含下标3)
            toLowerCase 转换成小写. 
            toUpperCase 转换成大写.
            为String对象动态添加trim函数:
                String.prototype.trim = function() {
                    //return this.replace(/^\s+|\s+$/g,"");
                    return this.replace(/^\s+/,"").replace(/\s+$/,"");
                }

    Array
        创建数组对象:
            var a1 = new Array(3);
            var a2 = new Array("A","B",100);
            var a3 = ["D","E",90];
        常用属性:
            length 获取数组的长度
            prototype 动态给数组对象添加属性或者方法
        常用方法:
            concat(另一个数组) 连接两个数组成一个新数组.  
            join(特殊字符) 将数组中所有的元素以特殊字符连接起来生成一个字符串. 
            pop() 弹出数组中最后一个元素. 
            push(ele1,ele2….) 向数组末尾添加多个元素 
            reverse() 反转数组. 
            slice(从哪个下标开始) 从指定下标开始向右截取子数组. 
            splice(从哪个下标开始,元素个数,newEle1,newEle2…). 添加或者删除数组中某些元素 
            sort 对数组升序排. 
            toString 将数组转换成字符串.

    Date
        创建日期对象:
            var t1 = new Date();
            var t2 = new Date(y,m,d);
            var t3 = new Date(y,m,d,h,mi,s);
        属性:
            prototype 日期对象动态扩展属性和方法
        常用方法:
            getDate 获取日期的"几号"
            getDay 获取日期是星期几. 
            getHours 获取日期的小时 
            getMinutes 获取日期的分钟. 
            getMonth 获取日期的月份. 
            getSeconds 获取日期的秒数. 
            getTime 获取自1970年1月1日到指定时间的毫秒数
                var nowTime = new Date();
                var timeStamp = nowTime.getTime(); 
                获取时间戳,在AJAX中解决浏览器缓存问题
          getYear 获取日期的年. (很少使用)
          getFullYear 获取日期的完整年份(推荐使用,避免千年虫问题)
          setDate 修改日期的"几号". 
          setHours 修改日期的"小时". 
          setMinutes 修改日期的"分钟". 
          setMonth 修改日期的"月份".
          setSeconds 修改日期的"秒". 
          setTime 修改时间,该方法参数是毫秒数(自1970年1月1日00:00:00的毫秒数). 
          setYear 修改日期的年份. 
          toGMTString 将日期转换成字符串(以GMT(格林威治时间)格式转换). 
          toLocaleString 将日期转换成字符串,以本地计算机环境为基础。. 
          UTC 获取自1970年1月1日到指定时间的毫秒数(国际标准时间)
              Date.UTC(2012,1,1,0,0,0);

    Math
        常用方法:
            abs 求绝对值
            random 获取一个从0到1的随机数
            round 四舍五入
            sqrt 求平方根
    Number
        常用属性:
            prototype 为Number类型动态扩展属性或方法
        常用方法:
            toString() 将数字转换成字符串

    RegExp
        创建正则表达式对象:
            var regExp = new RegExp("ab+c","i"); //显示创建
            var regExp = /ab+c/i;          //隐式创建
            g:global match
            i:ignore case
            gi:both global match and ignore case
            m:多行搜索
        常用方法:
            test(字符串); 判断给定的字符串是否符合正则表达式。 
        常用正则表达式:
            匹配中文字符的正则表达式: [\u4e00-\u9fa5]
            评注:匹配中文还真是个头疼的事,有了这个表达式就好办了
            var str = "按照空格切法";
            var re = "[\u4e00-\u9fa5]";
            var regExp  = new RegExp(re);
            alert(regExp.test(str));
            匹配双字节字符(包括汉字在内):[^\x00-\xff]
            评注:可以用来计算字符串的长度(一个双字节字符长度计2,ASCII字符计1)

            匹配空白行的正则表达式:\n\s*\r
            评注:可以用来删除空白行

            匹配HTML标记的正则表达式:<(\S*?)[^>]*>.*?</\1>|<.*? />
            评注:网上流传的版本太糟糕,上面这个也仅仅能匹配部分,对于复杂的嵌套标记依旧无能为力

            匹配首尾空白字符的正则表达式:^\s*|\s*$
            评注:可以用来删除行首行尾的空白字符(包括空格、制表符、换页符等等),非常有用的表达式

            匹配Email地址的正则表达式:
            /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/
            评注:表单验证时很实用
            var emailReg = /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/;
            var res = emailReg.test("wusz050163.com");
            alert(res);

            匹配网址URL的正则表达式:[a-zA-z]+://[^\s]*
            评注:网上流传的版本功能很有限,上面这个基本可以满足需求

            匹配帐号是否合法(字母开头,允许5-16字节,允许字母数字下划线):^[a-zA-Z][a-zA-Z0-9_]{4,15}$
            评注:表单验证时很实用

            匹配国内电话号码:\d{3}-\d{8}|\d{4}-\d{7}
            评注:匹配形式如 0511-4405222 或 021-87888822

            匹配腾讯QQ号:[1-9][0-9]{4,}
            评注:腾讯QQ号从10000开始

            匹配中国邮政编码:[1-9]\d{5}(?!\d)
            评注:中国邮政编码为6位数字

            匹配身份证:\d{15}|\d{18}
            评注:中国的身份证为15位或18位

            匹配ip地址:\d+\.\d+\.\d+\.\d+
            评注:提取ip地址时有用

            匹配特定数字:
            ^[1-9]\d*$    //匹配正整数
            ^-[1-9]\d*$   //匹配负整数
            ^-?[1-9]\d*$   //匹配整数
            ^[1-9]\d*|0$  //匹配非负整数(正整数 + 0)
            ^-[1-9]\d*|0$   //匹配非正整数(负整数 + 0)
            ^[1-9]\d*\.\d*|0\.\d*[1-9]\d*$   //匹配正浮点数
            ^-([1-9]\d*\.\d*|0\.\d*[1-9]\d*)$  //匹配负浮点数
            ^-?([1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0)$  //匹配浮点数
            ^[1-9]\d*\.\d*|0\.\d*[1-9]\d*|0?\.0+|0$   //匹配非负浮点数(正浮点数 + 0)
            ^(-([1-9]\d*\.\d*|0\.\d*[1-9]\d*))|0?\.0+|0$  //匹配非正浮点数(负浮点数 + 0)
            评注:处理大量数据时有用,具体应用时注意修正

            匹配特定字符串:
            ^[A-Za-z]+$  //匹配由26个英文字母组成的字符串
            ^[A-Z]+$  //匹配由26个英文字母的大写组成的字符串
            ^[a-z]+$  //匹配由26个英文字母的小写组成的字符串
            ^[A-Za-z0-9]+$  //匹配由数字和26个英文字母组成的字符串
            ^\w+$  //匹配由数字、26个英文字母或者下划线组成的字符串
            评注:最基本也是最常用的一些表达式

  window对象常用属性和函数
      self属性“与window对象完全相同,self通常用于确认就是在当前的窗体内”
      parent属性
      top属性
      open函数“开启一个新窗口,原窗口和新窗口是父子关系,该函数的返回值是新窗口对象”
          window.open(“http://www.baidu.com”);
          window.open(“http://www.baidu.com”,”target”);
      opener属性“获取当前窗口的开启者,通常负责父子窗口通讯”
      close函数“关闭窗口”
          当使用火狐的时候关闭close没有起作用所以我需要
          在火狐的地址栏输入:about:config
          然后找到dom.allow_scripts_to_close_windows;把false改为true
          火狐默认状态window.close是无效的
      confirm函数“弹出确认框”
      alert函数“弹出消息对话框”
      setInterval函数“每隔特定时间执行某个函数”
          window.setInterval(codes,间隔毫秒数);
          codes参数是函数名,或者“字符串的代码段”

  window对象的子对象location对象
      location对象既是window对象的属性又是document对象的属性,所以用
      window.location和document.location是一样的。
         location对象的常用属性和函数
              href属性“返回或者设置当前文档的URL”
                  alert(window.location.href); //获取当前文档URL
                  window.location.href = “http://www.baidu.com”; //设置当前文档的URL
              reload函数“重新加载当前文档”
                  window.location.reload(); 从浏览器缓存中重新加载该文档
                  window.location.reload(false); 从浏览器缓存中重新加载该文档
                  window.location.reload(true); 从服务器中重新加载该文档

  window对象的子对象history对象
      history对象常用函数
          go函数“前进或者后退指定的页数”
              <a href=”javascript:window.history.go(-1);”>后退</a>
              <a href=”javascript:window.history.go(1);”>前进</a>
          back函数“等同点击浏览器的后退按钮”
              <a href=”javascript:window.history.back();”>后退</a>

  window对象的子对象document对象(DOM)
      document对象包含一个节点对象,此对象包含每个单独页面的所有HTML元素,这就是W3C的DOM对象
          document对象常用属性和函数
          forms属性“获取整个文档中的所有form,返回一个数组”
              document.forms[0].submit();
              document.forms[1].reset();
              document.form的name或者id.submit();
      getElementById函数“通过标签的id获取某个文档中的元素”
      getElementsByName函数“通过标签name属性的值获取元素(数组)”
      getElementsByTagName函数“通过标签名获取元素(数组)”
      write函数“向文档中写入HTML代码”
      createElement函数“创建新元素”
      appendChild函数“在某元素末尾添加新元素”

      createElement和appendChild函数联合应用

      示例1:
        <html>
            <head>
                <title>js</title>
                <script type="text/javascript">
                    function add(){
                        var board = document.getElementById("board");
                        var e = document.createElement("input");
                        e.type = "button";
                        e.value = "这是测试加载的小例子";
                        var object = board.appendChild(e);
                    }

                </script>
            </head>
            <body>
                <div id="board"></div>
                <a href="javascript:add();">add</a>
            </body>
        </html>

      示例2:
        <html>
            <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

                <title>js</title>
                <script type="text/javascript">
                    function add(){
                        var board = document.getElementById("board");
                        var e2 = document.createElement("select");
                        e2.options[0] = new Option("加载项1", "");
                        e2.options[1] = new Option("加载项2", "");
                        e2.size = "1";
                        var object = board.appendChild(e2);
                    }
                 </script>
            </head>
            <body>
                <div id="board"></div>
                <a href="javascript:add();">add</a>
            </body>
        </html>
      示例3:
        <html>
            <head>
                <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
                <title>js</title>
                <script type="text/javascript">
                    function add(){
                        var board = document.getElementById("board");           
                        var e4 = document.createElement("input");
                        e4.setAttribute("type", "text");
                        e4.setAttribute("name", "q");
                        e4.setAttribute("value", "使用setAttribute");
                        e4.setAttribute("onclick", "javascript:alert('This is a test!');");           
                        var object = board.appendChild(e4);
                    }
                </script>
            </head>
            <body>
                <div id="board"></div>
                <a href="javascript:add();">add</a>
            </body>
        </html>


事件:
    事件                事件句柄               事件发生的条件…… 
    blur                  onBlur                  失去焦点. 
    change            onChange            select,text,textarea失去焦点并且内容改变. 
    click                 onClick                鼠标单击. 
    dblclick            onDblClick           鼠标双击
    focus               onFocus               window,frame,frameset,form的input获取焦点
    keydown          onKeyDown         按下键. 
    keypress          onKeyPress         按下又弹起. 
    keyup               onKeyUp             键弹起. 
    load                  onLoad                页面加载完毕马上发生. 
    mousedown     onMouseDown     按下鼠标. 
    mousemove     onMouseMove     鼠标移动. 
    mouseout         onMouseOut        鼠标离开区域. 
    mouseover       onMouseOver      鼠标经过. 
    mouseup          onMouseUp         鼠标释放. 
    reset                 onReset               重置form. 
    select               onSelect               选择input/textarea中的文本. 
    submit              onSubmit             提交form. (return true/false;)

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章