【笔记】菜鸟教程-JavaScript

一、javaScript输出
1、javaScript可以通过不同的方式来输出数据。
（1）window.alert()弹出警告框。
（2）document.write()方法将内容写到html文档中。
（3）innerHTML写入到html元素。
（4）console.log()写入到浏览器的控制台。
二、javaScipt语法
1、在编程语言中，一般固定值为字面量。
（1）javaScript字面量：①数字（Number）字面量。②字符串（String）字面量。③表达式字面量。④数组（Array）字面量。⑤对象（Object）字面量。⑥函数（Function）字面量。
（2）在指令式语言中，变量是一个名称，变量通常是可变的；字面量是一个值。
2、（1）JavaScript 关键字必须以字母、下划线（_）或美元符（$）开始。
（2）后续的字符可以是字母、数字、下划线或美元符（数字是不允许作为首字符出现的，以便 JavaScript 可以轻易区分开关键字和数字）
三、javaScript数据类型
（1）①javaScript数据类型：字符串（String）、数字（Number）、布尔（Boolean）、数组（Array）、对象（Object）、空（Null）、未定义（Undefined）。
②（aSuncat外注）：5种原始类型（primitive['prɪmɪtɪv] type):String、Number、Boolean、Undefined、Null
（2）创建数组的3种方式
①常规方式

var cars=new Array();
cars[0]='Saab';
cars[1]='Volvo';

②condensed array（简洁方式）

var cars=new Array('Saab','Volvo');

③literal array（字面）

var cars=['Saab','Volvo'];

（3）对象属性有2种寻址方式：

①name=person.lastname;
②name=person["lastname"];

（4）对象的赋值
（aSuncat外注）如果定义一个变量，要用这个变量给对象赋值，就得用person[y]="1"。如下：

var person={}
var y=id1;
person[y]="1";//不能用person.y="1";

得到的是：

person={id1:"1"};

（5）JavaScript 变量均为对象。当您声明一个变量时，就创建了一个新的对象。
①当您声明新变量时，可以使用关键词 “new” 来声明其类型：

var carname=new String;
var x=      new Number;
var y=      new Boolean;
var cars=   new Array;
var person= new Object;

（6）①访问person对象的fullName方法

name = person.fullName();

②访问 person 对象的 fullName 属性，它将作为一个定义函数的字符串返回：

name = person.fullName;

四、javaScript函数
1、（1）在使用 return 语句时，函数会停止执行，并返回指定的值。
函数调用将被返回值取代：

function myFunction(){
    var x=5;
    return x;
}
var myVar=myFunction();

（2）仅仅希望退出函数时 ，也可使用 return 语句。返回值是可选的。

function myFunction(a,b){
    if (a>b)
    {
        return;
    }
    x=a+b
}

如果a>b，则上面的代码将退出函数，并不会计算a和b的总和。

五、javaScript作用域
1、在 JavaScript 中, 对象和函数同样也是变量。（aSuncat：对象和函数既是字面量，又是变量）
2、在 JavaScript 中, 作用域为可访问变量，对象，函数的集合。
3、在 HTML 中, 全局变量是 window 对象: 所有数据变量都属于 window 对象。
六、javaScript字符串
1、可以使用索引位置来访问字符串中的每个字符。

var carname = 'Volvo XC60';
var character = carname[7];

2、字符串长度
可以使用内置属性 length 来计算字符串的长度

var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var sln = txt.length;

3、特殊字符

代码	全称	输出
\n	new line	换行
\r	return	回车
\t	tab	制表符
\b	backspace	退格
\f	form feed	换页符

4、创建字符串
（1） JavaScript 字符串是原始值，可以使用字符创建：

var firstName = "John"

（2）也可以使用 new 关键字将字符串定义为一个对象

 var firstName = new String("John")

注意：不要创建 String 对象。它会拖慢执行速度，并可能产生其他副作用。
5、（1）①原始值字符串，如 “John”, 没有属性和方法(因为他们不是对象)。
②原始值可以使用 JavaScript 的属性和方法，因为 JavaScript 在执行方法和属性时可以把原始值当作对象。
（2）（aSuncat：外注）
①原始值
存储在栈（stack）中的简单数据段，也就是说，它们的值直接存储在变量访问的位置。
②引用值
存储在堆（heap）中的对象，也就是说，存储在变量处的值是一个指针（point），指向存储对象的内存处。
6、字符串属性

属性	描述
constructor	返回创建字符串属性的函数
length	返回字符串的长度
prototype	允许您向对象添加属性

7、字符串方法

方法	描述	使用
charAt()	返回指定索引位置的字符	var n = str.charAt(2);
charCodeAt()	返回指定索引位置字符的Unicode值
concat()	连接两个或多个字符串，返回连接后的字符串	var n = str1.concat(str2);
fromCharCode()	将Unicode转换为字符串
indexOf()	返回字符串中检索指定字符第一次出现的位置。如果没有找到对应的字符，函数返回-1。	str.indexOf("welcome");
lastIndexOf()	返回字符串中检索指定字符最后一次出现的地方
localeCompare()	用本地特定的顺序来比较两个字符串
match()	找到一个或多个正则表达式的匹配。如果找到的话，返回这个字符；没有找到则返回null。	str.match("World")；//返回World或者null
replace()	替换与正则表达式匹配的子串.str.replace("Microsoft","w3cschool");
search()	检索与正则表达式相匹配的值
split()	把字符串分割为子字符串数组。	txt="a,b,c,d,e"//String; txt.split(",");//使用逗号分隔;输出[a,b,c,d,e]
slice()	提取字符串的片段，并在新的字符串中返回被提取的部分
substr()	从起始索引号提取字符串中指定数目的字符
substring()	提取字符串中两个指定的索引号之间的字符
toLocalLowerCase()	根据主机的语言环境把字符串转换为小写，只有几种语言（如土耳其语）具有地方特有的大小写映射
toLocalUpperCase()	根据主机的语言环境把字符串转换为大写，只有几种语言（如土耳其语）具有地方特有的大小写映射
toLowerCase()	把字符串转换为小写
toString()	返回字符串对象值
toUpperCase()	把字符串转换为大写
trim()	移除字符串首尾空白
valueOf()	返回某个字符串对象的原始值

七、javaScript运算符
在两个字符串之间增加空格的两种方法。
（1）把空格插入一个字符串之中。

txt1="What a very ";
txt2="nice day";
txt3=txt1+txt2;

（2）把空格插入字符串中

txt1="What a very";
txt2="nice day";
txt3=txt1+" "+txt2;

2、空文本 + 数字得到的运算结果都是把数字转成字符串，无论文本有多少个空格。

var result1=""+5;         // 得到的结果是"5"
var result2=" "+5;        // 得到的结果是"5"
var result3="       "+5;  // 得到的结果是"5"

八、javaScript比较
1、条件运算符（三目运算符）
variablename=(condition)?value1:value2

var voteable,age;
voteable=(age<18)?"年龄太小":"年龄已达到";

九、javaScript循环
1、for in循环不仅可以遍历对象的属性，还可以遍历数组。
十、javaScript Break和Continue
1、break 语句用于跳出循环。
continue 用于跳过循环中的一个迭代，所以 continue 只能用于循环的代码块。
2、（1）continue 语句（带有或不带标签引用）只能用在循环中。
（2）break 语句（不带标签引用），只能用在循环或 switch 中。
（3）通过标签引用，break 语句可用于跳出任何 JavaScript 代码块。

cars=["BMW","Volvo","Saab","Ford"];
list: 
{
    document.write(cars[0] + "<br>"); 
    document.write(cars[1] + "<br>"); 
    document.write(cars[2] + "<br>"); 
    break list;
    document.write(cars[3] + "<br>"); 
    document.write(cars[4] + "<br>"); 
    document.write(cars[5] + "<br>"); 
}

十一、javaScript typeof
1、用typeof检测null返回是object。
2、null是一个只有一个值的特殊类型。表示一个空对象引用。
3、undefined是一个没有设置值的变量。
4、null和undefined的值相等，但是类型不相等。
十二、javaScript类型转换
1、Number()转换为数字，String()转换为字符串，Boolean()转换为布尔值。
2、（1）javaScript中有5种不同的数据类型：string、number、boolean、object、function
（2）3种对象类型：Object、Date、Array
（3）2个不包含任何值的数据类型：null、undefined
3、（1）NaN的数据类型是number
（2）数组（Array）的数据类型是object
（3）日期（Date）的数据类型为object
（4）null的数据类型是object
（5）未定义变量的数据类型为undefined
4、如果对象是Array或Date，就无法通过typeof来判断他们的类型，因为都是Object.
5、constructor 属性返回所有 JavaScript 变量的构造函数。

（1）函数	返回值
“John”.constructor	// 返回函数 String() { [native code] }
(3.14).constructor	// 返回函数 Number() { [native code] }
false.constructor	// 返回函数 Boolean() { [native code] }
[1,2,3,4].constructor	// 返回函数 Array() { [native code] }
{name:‘John’, age:34}.constructor	// 返回函数 Object() { [native code] }
new Date().constructor	// 返回函数 Date() { [native code] }
function () {}.constructor	// 返回函数 Function(){ [native code] }

（2）可以使用constructor属性来查看对象是否为数组（包含字符串“Array”）

function isArray(myArray) {
    return myArray.constructor.toString().indexOf("Array") > -1;
}

（3）可以使用constructor属性来查看对象是否为日期（包含字符串“Date”）

function isDate(myDate) {
    return myDate.constructor.toString().indexOf("Date") > -1;
}

6、
（1）数字转换为字符串的方法：

方法	描述
String(x)
x.toString()
toExponential()	把对象的值转换为指数计数法。
toFixed()	把数字转换为字符串，结果的小数点后有指定位数的数字。

（2）日期转换为字符串

方法	描述
String(x)
x.toString()
getFullYear()	从Date对象以四位数字返回年份
getMonth()	从Date对象返回月份（0-11）
getDate()	从Date对象返回一个月中的某一天（1-31）
getHours()	返回Date对象的小时（0-23）
getSeconds()	返回Date对象的秒数（0-59）
getMilliseconds()	返回Date对象的毫秒（0-999）
getDay()	从Date对象返回一周中的某一天（0-6）
getTime()	返回1970年1月1日至今的毫秒数

（3）字符串转换为数字

方法	描述
Number()	①全局方法Number()可以将字符串转换为数字。②空字符串转换为0。③其他的字符串会转换为NaN
parseFloat()	解析一个字符串，并返回一个浮点数
parseInt()	解析一个字符串，并返回一个整数
一元运算符+	①可将变量转换为数字。②var y = "5"; // y 是一个字符串； var x = + y;// x 是一个数字 ③如果变量不能转换，它仍然会是一个数字，但值为NaN。var y = "John";// y 是一个字符串； var x = + y;// x 是一个数字 (NaN)

（4）布尔值转换为数字

方法	描述
Number()	Number(false)// 返回 0; Number(true) // 返回 1

（5）日期转换为数字

方法	描述
Number()	d = new Date();Number(d)
getTime()	日期方法getTime()能将日期转换为数字。d = new Date();d.getTime()

（6）自动转换类型
当javaScript尝试操作一个“错误”的数据类型时，会自动转换为“正确”的数据类型。
①数字+null，null转换为0，+为运算符
5 + null // 返回 5 ，null 转换为 0
②字符串+null，null转换为字符串"null"，+为拼接
“5” + null // 返回"5null" ， null 转换为 “null”
③字符串+数字，数字转换为字符串，+为拼接
“5” + 1 // 返回 “51”，1 转换为 “1”
④字符串-数字，字符串转换为数字，-为运算符
“5” - 1 // 返回 4，“5” 转换为 5
（7）自动转换为字符串
当你尝试输出一个对象或一个变量时，javaScript会自动调用变量的toString()方法

document.getElementById("demo").innerHTML = myVar;

// if myVar = {name:"Fjohn"}  // toString 转换为 "[object Object]"
// if myVar = [1,2,3,4]       // toString 转换为 "1,2,3,4"
// if myVar = new Date()      // toString 转换为 "Fri Jul 18 2014 09:08:55 GMT+0200"

十三、javaScript正则表达式
1、正则表达式
（1）正则表达式是由一个字符序列形成的搜索模式。
（2）搜索模式可用于文本搜索和文本替换。
（3）正则表达式可用于所有文本搜索和文本替换的操作。
2、var patt = /runoob/i
/runoob/i 是一个正则表达式。
runoob 是一个正则表达式主体 (用于检索)。
i 是一个修饰符 (搜索不区分大小写)。
3、在javaScript中，正则表达式通常用于两个字符串方法：search()和replace()。
（1）search()方法：用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串，并返回子串的起始位置。
①正则表达式搜索Runoob，且不区分大小写。

var str='I love Runoob Runoob';
var n = str.search(/Runoob/i);
console.log(n);//得到的n为7(第一个Runoob的R的下标)

②search()方法可使用字符串作为参数。字符串参数会转换为正则表达式。

var n = str.search("Runoob");

（2）replace()方法：用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。
①使用正则表达式且不区分大小写将字符串中的 Microsoft 替换为 Runoob :

var txt = str.replace(/microsoft/i,"Runoob");

②replace() 方法将接收字符串作为参数。

var txt = str.replace("Microsoft","Runoob");

4、正则表达式修饰符

修饰符	描述
i	执行对大小写不敏感的匹配
g	执行全局匹配（查找所有匹配而非在找到第一个匹配后停止）
m	执行多行匹配

5、正则表达式模式
（1）方括号用于查找某个范围内的字符。

表达式	描述
[abc]	查找方括号之间的任何字符
[0-9]	查找任何从0至9的数字
(x|y)	查找任何以|分割的选项

（2）元字符是拥有特殊含义的字符

元字符	描述
\d	查找数字
\s	查找空白字符
\b	匹配单词边界
\uxxxx	查找以十六进制数xxxx规定的Unicode字符

（3）量词

量词	描述
m+	匹配任何包含至少一个m的字符串:1|n
m*	匹配任何包含零个或多个m的字符串:0|n
m?	匹配任何包含零个或一个m的字符串:0|1

6、使用RegExp对象
在javaScript中，RegExp对象是一个预定义了属性和方法的正则表达式对象。
7、test()和exec()
（1）test()
test()方法是一个正则表达式方法。
test()方法用于检测一个字符串是否匹配某个模式，如果字符串中含有匹配的文本，则返回true，否则返回false.
①

var patt = /e/;
var str="The best things in life are free!";
patt.test(str);

返回true
②

var str = 'runoob';
var patt1 = new RegExp('\\w', 'g'); // 有转义作为正则表达式处理
var patt2 = new RegExp('\w', 'g');  // 无转义作为字符串处理
var patt3 =/\w+/g;  // 与 patt1 效果相同
document.write(patt1.test(str)) //输出 true
document.write("<br>") 
document.write(patt2.test(str)) //输出 false
document.write("<br>") 
document.write(patt3.test(str)) //输出 true

（2）exec()
exec()方法是一个正则表达式方法。
exec()方法用于检索字符串中的正则表达式的匹配。
该函数返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回值为null。

var patt=/e/;
var str="The best things in life are free!"
patt.exec(str);

返回e
十四、javaScipt错误
1、javaScript错误-throw、try和catch
（1）try语句测试代码块的错误。
（2）catch语句处理错误。
（3）throw语句创建自定义错误。
2、try和catch
（1）try语句允许我们定义在执行时进行错误测试的代码块。
（2）catch语句允许我们定义当try代码块发生错误时，所执行的代码快。
（3）javaScript语句try和catch是成对出现的。

try {
  //在这里运行代码
} catch(err) {
  //在这里处理错误
}

（4）catch块会捕捉到try块中的错误，并执行代码来处理它。

var txt=""; 
function message() 
{ 
    try { 
        adddlert("Welcome guest!"); 
    } catch(err) { 
        txt="本页有一个错误。\n\n"; 
        txt+="错误描述：" + err.message + "\n\n"; 
        txt+="点击确定继续。\n\n"; 
        alert(txt); 
    } 
}

3、throw语句
（1）throw语句创建或抛出异常(exception[ik’sepʃən]:异常)。
（2）throw与try和catch一起使用，能够控制程序流，并生成自定义的错误消息。
（3）语法

throw exception

异常可以是javaScript字符串、数字、逻辑值或对象。

function myFunction() {
    var message, x;
    message = document.getElementById("message");
    message.innerHTML = "";
    x = document.getElementById("demo").value;
    try { 
        if(x == "")  throw "值为空";
        if(isNaN(x)) throw "不是数字";
        x = Number(x);
        if(x < 5)    throw "太小";
        if(x > 10)   throw "太大";
    } catch(err) {
        message.innerHTML = "错误: " + err;
    }
}

十五、javaScript调试
1、console.log()
2、debugger
debugger关键字用于停止执行javaScript，并调用调试函数。这个关键字与在调试工具中设置断点的效果是一样的。
十六、javaScript变量提升
1、javaScript中，函数及变量的声明都将被提升到函数的最顶部。

x = 5; // 变量 x 设置为 5
elem = document.getElementById("demo"); // 查找元素 
elem.innerHTML = x;                     // 在元素中显示 x
var x; // 声明 x

2、javaScipt只有声明的变量会提升，初始化的不会。

var x = 5; // 初始化 x
elem = document.getElementById("demo"); // 查找元素 
elem.innerHTML = x + " " + y;           // 显示 x 和 y
var y = 7; // 初始化 y

y输出了undefined，因为变量声明(var y)提升了，但是初始化（y=7）并不会提升，所以y变量是一个未定义的变量。
上述代码类似于下列代码

var x = 5; // 初始化 x
var y;     // 声明 y
elem = document.getElementById("demo"); // 查找元素
elem.innerHTML = x + " " + y;           // 显示 x 和 y
y = 7;    // 设置 y 为 7

十七、javaScript严格模式（use strict）
1、严格模式通过在脚本或函数的头部添加 “use strict”; 表达式来声明。“use strict” 指令只运行出现在脚本或函数的开头。
2、为什么使用严格模式？
消除javascript语法的一些不合理，不严谨之处，减少一些怪异行为。
（1）消除代码运行的一些不安全之处，保证代码运行的安全。
（2）提高编译器效率，增加运行速度。
（3）为未来新版本的javascript做好铺垫。
3、同样的代码，在"严格模式"中，可能会有不一样的运行结果；一些在"正常模式"下可以运行的语句，在"严格模式"下将不能运行。
4、严格模式的限制：
（1）不允许使用未声明的变量。
对象也是一个变量。
（2）不允许删除变量或对象。

"use strict";
var x = 3.14;
delete x;                // 报错

（3）不允许删除函数。
（4）不允许变量重名。
（5）不允许使用八进制。
（6）不允许使用转义字符。

"use strict";
var x = \010;            // 报错

（7）不允许对只读属性赋值。

"use strict";
var obj = {};
Object.defineProperty(obj, "x", {value:0, writable:false});
obj.x = 3.14;            // 报错

（8）不允许对一个使用getter方法读取的属性进行赋值。

"use strict";
var obj = {get x() {return 0} };

obj.x = 3.14;            // 报错

（9）不允许删除一个不允许删除的属性。

"use strict";
delete Object.prototype; // 报错

（10）变量名不能使用“eval”字符串。
（11）变量名不能使用“arguments”字符串。
（12）不允许使用以下这种语句。

"use strict";
with (Math){x = cos(2)}; // 报错

（13）由于一些安全原因，在作用域eval()创建的变量不能被调用。

"use strict";
eval ("var x = 2");
alert (x);               // 报错

（14）禁止this关键字指向全局对象。

function f(){
	return !this;
} 
// 返回false，因为"this"指向全局对象，"!this"就是false

function f(){ 
	"use strict";
	return !this;
} 
// 返回true，因为严格模式下，this的值为undefined，所以"!this"为true。

因此，使用构造函数时，如果忘了加new，this不再指向全局对象，而是报错。

function f(){
	"use strict";
	this.a = 1;
};
f();// 报错，this未定义

十八、javaScript使用误区：
1、赋值运算符应用错误。
在javaScript程序中，如果你在if条件语句中使用赋值运算符的等号（=）将会产生一个错误结果，正确的方法是使用比较运算符的两个等号（==）。
（1）

var x = 0;
if (x == 10)//返回false（因为x不等于10）

（2）

var x = 0;
if (x = 10)//返回true(因为条件语句执行为x赋值为10，10为true)

（3）

var x = 0;
if (x = 0)//返回false（因为条件语句执行为x赋值0，0为false）

赋值语句返回变量的值。
2、比较运算符常见错误
这种错误经常会在switch语句中出现，switch语句会使用恒等计算符（===）进行比较。
3、加法与连接注意事项。
加法是两个数字相加。
连接是两个字符串连接。
javaScript的加法和连接都使用+运算符。
4、浮点型数据使用注意事项
javaScript中的所有数据都是以64位浮点型数据（float）来存储。

var x = 0.1;
var y = 0.2;
var z = x + y            // z 的结果为 0.3
if (z == 0.3)            // 返回 false

为解决以上问题，可以用整数的乘除法来解决：

var z = (x * 10 + y * 10) / 10;       // z 的结果为 0.3

5、字符串分行
（1）javaScript允许我们在字符串中使用断行语句：

var x =
"Hello World!";

（2）在字符串中直接使用回车换行是会报错的：

var x = "Hello
World!";

（3）字符串断行需要使用反斜杠（\）

var x = "Hello \
World!";

6、return语句使用注意事项。
不要对 return 语句进行断行。

function myFunction(a) {
    var
    power = 10;  
    return
    a * power;
}

返回undefind;
①如果是一个不完整的语句，如：var
②javaScript将尝试读取第二行的语句：power=10;
③但是由于这样的语句是完整的：return
④javaScript将自动关闭语句：return;
由于 return 是一个完整的语句，所以 JavaScript 将关闭 return 语句。
7、数组中使用名字来索引
（1）许多程序语言都允许使用名字来作为数组的索引。
使用名字来作为索引的数组称为关联数组（或哈希）。
（2）javaScript不支持使用名字来索引数组，只允许使用数字索引。

var person = [];
person[0] = "John";
person[1] = "Doe";
person[2] = 46;
var x = person.length;         // person.length 返回 3
var y = person[0];             // person[0] 返回 "John"

（3）在javaScript中，对象使用名字作为索引。
如果你使用名字作为索引，当访问数组时，javaScript会把数组重新定义为标准对象。
执行这样的操作后，数组的方法和属性将不能再使用，否则会产生错误。

var person = [];
person["firstName"] = "John";
person["lastName"] = "Doe";
person["age"] = 46;
var x = person.length;         // person.length 返回 0
var y = person[0];             // person[0] 返回 undefined

8、undefined不是null
（1）在javaScript中，null用于对象,undefined用于变量，属性和方法。
对象只有被定义才有可能为null，否则为undefined；
（2）如果我们想测试对象是否存在，在对象还没定义时会抛出一个错误。
错误的使用方式：

if (myObj !== null && typeof myObj !== "undefined") 

正确的方式是我们需要先使用typeof来检测对象是否已定义：

if (typeof myObj !== "undefined" && myObj !== null)

十九、javaScript表单
1、数据验证
（1）服务端数据验证：是在数据提交到服务器上后再验证。
（2）客户端数据验证（side validation）：是在数据发送到服务器前，在浏览器上完成验证。
2、约束验证css伪类选择器

选择器	描述
:disabled	选取属性为“disabled”属性的input元素
:invalid	选取无效的input元素
:optional	选择没有“required”属性的input元素
:required	选择有“required”属性的input元素
:valid	选取有效值的input元素

二十、javaScript验证API
1、约束验证DOM方法

property	description
checkValidity()	如果input元素中的数据是合法的返回true，否则返回false
setCustomValidity()	设置input元素的validationMessage属性，用于自定义错误提示信息的方法。

<input id="id1" type="number" min="100" max="300" required>
<button onclick="myFunction()">验证</button>
 
<p id="demo"></p>
 
<script>
function myFunction() {
    var inpObj = document.getElementById("id1");
    if (inpObj.checkValidity() == false) {
        document.getElementById("demo").innerHTML = inpObj.validationMessage;
    }
}
</script>

2、约束验证DOM属性

属性	描述
validity	布尔属性值，返回input输入值是否合法
validationMessage	浏览器错误提示信息
willValidate	指定input是否需要验证

3、validity属性

属性	描述
customError	设置为true，如果设置了自定义的validity信息。
patternMismatch	设置为true，如果元素的值不匹配它的模式属性。
rangeOverflow	设置为true，如果元素的值大于设置的最大值。
rangeUnderflow	设置为true,如果元素的值小于它的最小值
stepMismatch	设置为true，如果元素的值超过了maxLength属性设置的长度
typeMismatch	设置为true，如果元素的值不是预期相匹配的类型
valueMissing	设置为true，如果元素（required属性）没有值
valid	设置为true，如果元素的值是合法的。

<input id="id1" type="number" min="100" required>
<button onclick="myFunction()">OK</button>
 
<p id="demo"></p>
 
<script>
function myFunction() {
    var txt = "";
    var inpObj = document.getElementById("id1");
    if(!isNumeric(inpObj.value)) {
        txt = "你输入的不是数字";
    }else if(inpObj.validity.rangeOverflow) {
       txt = "输入的值太大了";
    }else if (inpObj.validity.rangeUnderflow) {
        txt = "输入的值太小了";
    } else {
        txt = "输入正确";
    }
    document.getElementById("demo").innerHTML = txt;
}
 
// 判断输入是否为数字
function isNumeric(n) {
    return !isNaN(parseFloat(n)) && isFinite(n);
}
</script>

二十一、javaScript保留关键字
地址：http://www.runoob.com/js/js-reserved.html

二十二、javaScript JSON
1、json语法规则：
（1）数据为键/值对。
（2）数据由逗号分隔。
（3）大括号保存对象
（4）方括号保存数组
2、json数据——一个名称对应一个值
键/值对包含字段名称（在双引号中），后面一个冒号，然后是值：

"name":"Runoob"

3、json字符串转换为javaScript对象
（1）创建javaScript字符串，字符串为json格式的数据。

var text = '{ "sites" : [' +
'{ "name":"Runoob" , "url":"www.runoob.com" },' +
'{ "name":"Google" , "url":"www.google.com" },' +
'{ "name":"Taobao" , "url":"www.taobao.com" } ]}';

（2）使用javaScript内置对象JSON.parse()将字符串转换为javaScript对象：

var obj = JSON.parse(text);

（3）在页面中使用新的javaScript对象：

var text = '{ "sites" : [' +
    '{ "name":"Runoob" , "url":"www.runoob.com" },' +
    '{ "name":"Google" , "url":"www.google.com" },' +
    '{ "name":"Taobao" , "url":"www.taobao.com" } ]}';
    
obj = JSON.parse(text);
document.getElementById("demo").innerHTML = obj.sites[1].name + " " + obj.sites[1].url;

4、相关函数

函数	描述
JSON.parse()	用于将一个JSON字符串转换为javaScript对象
JOSN.stringify()	用于将javaScript值转换为JSON字符串

二十三、javaScript void
1、javascript:void(0)中最关键的是void关键字，void是javaScript中非常重要的关键字，该操作符指定要计算一个表达式但是不返回值。
2、语法格式如下：

<head>
<script type="text/javascript">
<!--
void func()
javascript:void func()
或者
void(func())
javascript:void(func())
//-->
</script>
</head>

void(0)计算为0，但javaScript上没有任何效果。
3、href="#"与href="javascript:void(0)"的区别
（1）#包含了一个位置信息，默认的锚是#top也就是网页的上端。
（2）javascript:void(0)，仅仅表示一个死链接。
（3）在页面很长的时候会用#来定位页面的具体位置，格式为：#+id
二十四、javaScript代码规范
1、代码规范通常包括以下几个方面。
（1）变量和函数的命名规则。
（2）空格、缩进、注释的使用规则
（3）其他常用规范…
2、变量名。
变量名推荐使用驼峰法来命名（camelCase）。
3、空格与运算符。
通常运算符（=±*/）前后需要添加空格。

var x = y + z;

4、代码缩进
（1）通常使用4个空格符号来缩进代码块。
（2）不推荐使用tab键来缩进，因为不同编辑器tab键的解析不一样。
5、语句规则。
（1）简单语句的通用规则：
①一条语句通常以分号作为结束符。
（2）复杂语句的通用规则。
①将花括号放在第一行的结尾。
②左花括号前添加一空格。
③将右花括号独立放在一行。
④不要以分号结束一个复杂的声明。

function toCelsius(fahrenheit) {
    return (5 / 9) * (fahrenheit - 32);
}

6、对象规则
（1）将左花括号与类名放在同一行。
（2）冒号与属性值间有个空格。
（3）字符串使用双引号，数字不需要。
（4）最后一个属性-值对后面不要添加逗号。
（5）将右花括号独立放在一行，并以分号作为结束符号。

var person = {
    firstName: "John",
    lastName: "Doe",
    age: 50,
    eyeColor: "blue"
};

（6）短的对象代码可以直接写成一行。

var person = {firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"};

7、每行代码字符小于80
（1）为了便于阅读每行字符建议小于数80个。
（2）如果一个javaScript语句超过了80个字符，建议在运算符或者逗号后换行。

document.getElementById("demo").innerHTML =
    "Hello Runoob.";

8、命名规则
（1）一般很多代码语言的命名规则都是类似的。
①变量和函数为驼峰法。（camelCase）
②全局变量为大写（UPPERCASE）
③变量（如PI）为大写（UPPERCASE）
（2）html和css的横杠（-）字符
①css使用-来连接属性名（font-size）。
②-通常在javaScript被认为是减法，所以不允许使用。
（3）下划线。
①SQL数据库。
②php语言通常都使用下划线。
（4）帕斯卡拼写法（PascalCase）。
①单字之间不以空格断开或连接号（-），底线（_）连接，第一个单字首字母采用大写字母，后续单字的首字母亦用大写字母。
②帕斯卡命名法也称为“大驼峰式命名法”。
③帕斯卡拼写法（PascalCase）在C语言中运用较多。

js函数

二十五、javaScript函数定义
1、函数声明后不会立即执行，会在我们需要的时候调用到。
2、分号是用来分隔可执行JavaScript语句。
由于函数声明不是一个可执行语句，所以不以分号结束。
3、匿名函数：

var x = function (a, b) {return a * b};
var z = x(4, 3);

匿名函数，函数存储在变量中，不需要函数名称，通常通过变量名来调用。
4、函数定义的3种方式：
（1）函数声明：

function myFunction(a, b) {
    return a * b;
}

（2）函数表达式：

var x = function (a, b) {return a * b};

（3）Function()构造函数

var myFunc = new Function("a", "b", "return a * b");

var x = myFunc(4, 3);

也可以写成：

var myFunction = function (a, b) {return a * b}

var x = myFunction(4, 3);

注意：在 JavaScript 中，很多时候，你需要避免使用 new 关键字。
5、（1）函数可以通过声明定义，也可以是一个表达式。
（2）函数可以作为一个值使用，也可以作为一个表达式使用。
①值：

function myFunction(a, b) {
    return a * b;
}

var x = myFunction(4, 3);

②表达式：

function myFunction(a, b) {
    return a * b;
}

var x = myFunction(4, 3) * 2;

6、提升（Hoisting）
（1）提升是 JavaScript 默认将当前作用域提升到前面去的的行为。
（2）提升（Hoisting）应用在变量的声明与函数的声明。
（3）表达式定义函数时无法提升。
7、自调用函数
（1）函数表达式可以 “自调用”。
（2）自调用表达式会自动调用。
（3）如果表达式后面紧跟 () ，则会自动调用。
（4）不能自调用声明的函数。
（5）通过添加括号，来说明它是一个函数表达式。
（6） 匿名自我调用的函数：

(function () {
    var x = "Hello!!";      // 我将调用自己
})();

8、函数是对象
（1）arguments.length 属性返回函数调用过程接收到的参数个数

function myFunction(a, b) {
    return arguments.length;
}

（2）toString() 方法将函数作为一个字符串返回:

function myFunction(a, b) {
    return a * b;
}

var txt = myFunction.toString();

9、函数定义作为对象的属性，称之为对象方法。
函数如果用于创建新的对象，称之为对象的构造函数。

二十六、javaScript函数参数
1、显式参数(Parameters)与隐式参数(Arguments)
函数显式参数在函数定义时列出。
函数隐式参数在函数调用时传递给函数真正的值。
2、默认参数
如果函数在调用时未提供隐式参数，参数会默认设置为： undefined
有时这是可以接受的，但是建议最好为参数设置一个默认值：

function myFunction(x, y) {
    y = y || 0;//如果y已经定义 ， y || 返回 y, 因为 y 是 true, 否则返回 0, 因为 undefined 为 false。
}

3、arguments对象
JavaScript 函数有个内置的对象 arguments 对象。
argument 对象包含了函数调用的参数数组。
4、传递参数的2种途径：
（1）通过值传递参数
①在函数中调用的参数是函数的隐式参数。
②JavaScript 隐式参数通过值来传递：函数仅仅只是获取值。
③如果函数修改参数的值，不会修改显式参数的初始值（在函数外定义）。
④隐式参数的改变在函数外是不可见的。
（2）通过对象传递参数
①在JavaScript中，可以引用对象的值。
②因此我们在函数内部修改对象的属性就会修改其初始的值。
③修改对象属性可作用于函数外部（全局变量）。
④修改对象属性在函数外是可见的。
二十七、javaScript函数调用
1、javaScript4种调用方式：作为函数调用、函数作为方法调用、使用构造函数调用函数、作为函数方法调用函数。
每种方式的不同方式在于 this 的初始化。

// 1、作为函数调用
function myFunction(a, b) {
    return a * b;
}
myFunction(10, 2);           // myFunction(10, 2) 返回 20

// 2、函数作为方法调用
var myObject = {
    firstName:"John",
    lastName: "Doe",
    fullName: function () {
        return this.firstName + " " + this.lastName;
    }
}
myObject.fullName();         // 返回 "John Doe"

// 3、使用构造函数调用函数
// 构造函数:
function myFunction(arg1, arg2) {
    this.firstName = arg1;
    this.lastName  = arg2;
} 
// This    creates a new object
var x = new myFunction("John","Doe");
x.firstName;                             // 返回 "John"

// 4、作为函数方法调用
// call
function myFunction(a, b) {
    return a * b;
}
myObject = myFunction.call(myObject, 10, 2);     // 返回 20

// apply
function myFunction(a, b) {
    return a * b;
}
myArray = [10, 2];
myObject = myFunction.apply(myObject, myArray);  // 返回 20

2、this
一般而言，在Javascript中，this指向函数执行时的当前对象。
3、

function myFunction(a, b) {
    return a * b;
}
window.myFunction(10, 2);   //window.myFunction(10, 2) 返回 20

这是调用 JavaScript 函数常用的方法， 但不是良好的编程习惯
全局变量，方法或函数容易造成命名冲突的bug。
4、全局对象
（1）当函数没有被自身的对象调用时， this 的值就会变成全局对象。
（2）在 web 浏览器中全局对象是浏览器窗口（window 对象）。
（3）函数作为全局对象调用，会使 this 的值成为全局对象。
使用 window 对象作为一个变量容易造成程序崩溃。
5、函数作为方法调用

var myObject = {
    firstName:"John",
    lastName: "Doe",
    fullName: function () {
        return this.firstName + " " + this.lastName;
    }
}
myObject.fullName();         // 返回 "John Doe"

函数作为对象方法调用，会使得 this 的值成为对象本身。
6、使用构造函数调用函数
（1）如果函数调用前使用了 new 关键字, 则是调用了构造函数。
这看起来就像创建了新的函数，但实际上 JavaScript 函数是重新创建的对象。
（2）构造函数的调用会创建一个新的对象。新对象会继承构造函数的属性和方法。
（3）构造函数中 this 关键字没有任何的值。
this 的值在函数调用时实例化对象(new object)时创建。
7、作为函数方法调用函数
（1）在 JavaScript 中, 函数是对象。JavaScript 函数有它的属性和方法。
（2）call() 和 apply() 是预定义的函数方法。 两个方法可用于调用函数，两个方法的第一个参数必须是对象本身。
（3）

function myFunction(a, b) {
    return a * b;
}
myObject = myFunction.call(myObject, 10, 2);     // 返回 20

function myFunction(a, b) {
    return a * b;
}
myArray = [10, 2];
myObject = myFunction.apply(myObject, myArray);  // 返回 20

两个方法都使用了对象本身作为第一个参数。 两者的区别在于第二个参数： apply传入的是一个参数数组，也就是将多个参数组合成为一个数组传入，而call则作为call的参数传入（从第二个参数开始）。
在 JavaScript 严格模式(strict mode)下, 在调用函数时第一个参数会成为 this 的值， 即使该参数不是一个对象。
在 JavaScript 非严格模式(non-strict mode)下, 如果第一个参数的值是 null 或 undefined, 它将使用全局对象替代。
通过 call() 或 apply() 方法你可以设置 this 的值, 且作为已存在对象的新方法调用。
二十八、javaScript闭包
1、JavaScript 变量可以是局部变量或全局变量。
私有变量可以用到闭包。
2、变量声明时如果不使用 var 关键字，那么它就是一个全局变量，即便它在函数内定义。
3、全局和局部变量即便名称相同，它们也是两个不同的变量。修改其中一个，不会影响另一个的值。
4、（1）闭包是可访问上一层函数作用域里变量的函数，即便上一层函数已经关闭。

var add = (function () {
    var counter = 0;
    return function () {return counter += 1;}
})();
add();
add();
add();
// 计数器为 3

①add变量可以作为一个函数使用。非常棒的部分是它可以访问函数上一层作用域的计数器。
②这个叫作 JavaScript 闭包。它使得函数拥有私有变量变成可能。
③计数器受匿名函数的作用域保护，只能通过 add 方法修改。
（2）闭包就是一个函数引用另一个函数的变量，因为变量被引用着所以不会被回收，因此可以用来封装一个私有变量。这是优点也是缺点，不必要的闭包只会增加内存消耗。
或者说闭包就是子函数可以使用父函数的局部变量，还有父函数的参数。

js html dom

二十九、dom简介
1、Document Object Model，文档对象模型
三十、dom html
1、改变html元素的属性：
document.getElementById(id).attribute=新属性值

document.getElementById("image").src="landscape.jpg";

三十一、dom css
document.getElementById(id).style.property=新样式

document.getElementById("p2").style.color="blue";

三十二、dom事件
1、onload 和 onunload 事件
onload 和 onunload 事件可用于处理 cookie。
2、onmousedown、onmouseup 以及 onclick 事件
onmousedown, onmouseup 以及 onclick 构成了鼠标点击事件的所有部分。首先当点击鼠标按钮时，会触发 onmousedown 事件，当释放鼠标按钮时，会触发 onmouseup 事件，最后，当完成鼠标点击时，会触发 onclick 事件。
三十三、dom EventListener
1、addEventListener()
（1）addEventListener() 方法用于向指定元素添加事件句柄。
（2）addEventListener() 方法添加的事件句柄不会覆盖已存在的事件句柄。
（3）你可以向任何 DOM 对象添加事件监听，不仅仅是 HTML 元素。如： window 对象。
（4）addEventListener() 方法可以更简单的控制事件（冒泡与捕获）。
（5）当你使用 addEventListener() 方法时, JavaScript 从 HTML 标记中分离开来，可读性更强， 在没有控制HTML标记时也可以添加事件监听。
（6）可以使用 removeEventListener() 方法来移除事件的监听。
2、语法

element.addEventListener(event, function, useCapture);

（1）第一个参数是事件的类型 (如 “click” 或 “mousedown”).
（2）第二个参数是事件触发后调用的函数。
（3）第三个参数是个布尔值用于描述事件是冒泡还是捕获。该参数是可选的。
3、当用户重置窗口大小时添加事件监听：

window.addEventListener("resize", function(){
    document.getElementById("demo").innerHTML = sometext;
});

4、事件冒泡或事件捕获
（1）事件传递有两种方式：冒泡与捕获。
（2）事件传递定义了元素事件触发的顺序。 如果你将 <p> 元素插入到 <div> 元素中，用户点击<p> 元素, 哪个元素的 “click” 事件先被触发呢？
（3）在 冒泡 中，内部元素的事件会先被触发，然后再触发外部元素，即：<p> 元素的点击事件先触发，然后会触发 <div> 元素的点击事件。
（4）在 捕获 中，外部元素的事件会先被触发，然后才会触发内部元素的事件，即：<div> 元素的点击事件先触发 ，然后再触发<p>元素的点击事件。
（5）addEventListener() 方法可以指定 “useCapture” 参数来设置传递类型：
（6）addEventListener(event, function, useCapture);
默认值为 false, 即冒泡传递，当值为 true 时, 事件使用捕获传递。
5、（1） IE 8 及更早 IE 版本，Opera 7.0及其更早版本不支持 addEventListener() 和 removeEventListener() 方法。但是，对于这类浏览器版本可以使用 detachEvent() 方法来移除事件句柄:

element.attachEvent(event, function);
element.detachEvent(event, function);

（2）跨浏览器解决办法：

var x = document.getElementById("myBtn");
if (x.addEventListener) {                    // 所有主流浏览器，除了 IE 8 及更早版本
    x.addEventListener("click", myFunction);
} else if (x.attachEvent) {                  // IE 8 及更早版本
    x.attachEvent("onclick", myFunction);
}

三十四、dom元素
1、var para=document.createElement("p");
2、var node=document.createTextNode("这是一个新段落。");
3、para.appendChild(node);
4、parent.removeChild(child);
5、child.parentNode.removeChild(child);

js高级教程

三十五、javaScript对象
1、javaScript中的所有事物都是对象：字符串、数值、数组、函数…
JavaScript 提供多个内建对象，比如 String、Date、Array 等等。 对象只是带有属性和方法的特殊数据类型。
2、对象的属性和方法：
（1）访问对象属性的语法是：

objectName.propertyName

（2）方法是能够在对象上执行的动作。
可以通过以下语法来调用方法：

objectName.methodName()

3、创建对象的2种方法：
（1）定义并创建对象的实例

person=new Object();
person.firstname="John";
person.lastname="Doe";
person.age=50;
person.eyecolor="blue";

（2）使用函数来定义对象，然后创建新的对象实例

//使用对象构造器
function person(firstname,lastname,age,eyecolor){
this.firstname=firstname;
this.lastname=lastname;
this.age=age;
this.eyecolor=eyecolor;
}
var myFather=new person("John","Doe",50,"blue");
var myMother=new person("Sally","Rally",48,"green");

在JavaScript中，this通常指向的是我们正在执行的函数本身，或者是指向该函数所属的对象（运行时）
4、JavaScript 是面向对象的语言，但 JavaScript 不使用类。
在 JavaScript 中，不会创建类，也不会通过类来创建对象（就像在其他面向对象的语言中那样）。
JavaScript 基于 prototype，而不是基于类的。
5、JavaScript for…in 语句循环遍历对象的属性。

for (variable in object){
	执行的代码……
}

for…in 循环中的代码块将针对每个属性执行一次。
三十六、javaScript Number对象
1、JavaScript 不是类型语言。与许多其他编程语言不同，JavaScript 不定义不同类型的数字，比如整数、短、长、浮点等等。
2、javaScript中，所有的数字都是浮点型类型。
3、精度
（1）整数（不使用小数点或指数计数法）最多为 15 位。

var x = 999999999999999;   // x 为 999999999999999
var y = 9999999999999999;  // y 为 10000000000000000

（2）小数的最大位数是 17，但是浮点运算并不总是 100% 准确：

var x = 0.2+0.1; // 输出结果为 0.30000000000000004

4、八进制和十六进制
（1）如果前缀为 0，则 JavaScript 会把数值常量解释为八进制数，如果前缀为 0 和 “x”，则解释为十六进制数。

var y = 0377;
var z = 0xFF; 
document.write(y + "<br>");//255
document.write(z + "<br>");//255

绝不要在数字前面写零，除非您需要进行八进制转换。
（2）默认情况下，JavaScript 数字为十进制显示。
但是你可以使用 toString() 方法 输出16进制、8进制、2进制。

var myNumber=128;
myNumber.toString(16);   // 返回 80
myNumber.toString(8);    // 返回 200
myNumber.toString(2);    // 返回 10000000

5、无穷大（infinity）
无穷大值的行为特性和我们所期望的是一致的：基于它们的加、减、乘和除运算结果还是无穷大（当然还保留它们的正负号）。
6、NaN
NaN 属性是代表非数字值的特殊值。该属性用于指示某个值不是数字。可以把 Number 对象设置为该值，来指示其不是数字值。

var x = 1000 / "Apple";
isNaN(x); // 返回 true
var y = 100 / "1000";
isNaN(y); // 返回 false

7、数字属性

属性	备注
MAX_VALUE	最大值
MIN_VALUE
NEGATIVE_INFINITY
POSITIVE_INFINITY
NaN
prototype
constructor

8、数字方法

方法	备注
toExponential()
toFixed()
toPrecision()
toString()
valueOf()

三十七、javaScript String
三十八、javaScript日期
1、4种初始化日期方式：

new Date() // 当前日期和时间
new Date(milliseconds) //返回从 1970 年 1 月 1 日至今的毫秒数
new Date(dateString)
new Date(year, month, day, hours, minutes, seconds, milliseconds)

上面的参数大多数都是可选的，在不指定的情况下，默认参数是0。
2、设置日期
将日期对象设置为 5 天后的日期：

var myDate=new Date();
myDate.setDate(myDate.getDate()+5);

注意: 如果增加天数会改变月份或者年份，那么日期对象会自动完成这种转换。
三十九、javaScript 数组
1、可以在一个数组中包含对象元素、函数、数组。

myArray[0]=Date.now;
myArray[1]=myFunction;
myArray[2]=myCars;

2、var y=myCars.indexOf("Volvo");// "Volvo" 值的索引值

四十、javaScript Boolean
1、定义一个名为 myBoolean 的布尔对象：

var myBoolean=new Boolean();

2、如果布尔对象无初始值或者其值为:
0、-0、null、""、false、undefined、NaN
那么对象的值为 false。
否则，其值为true。（即使是字符串“false”）
四十一、javaScript Match
1、JavaScript 提供 8 种可被 Math 对象访问的算数值：
Math.E
Math.PI
Math.SQRT2
Math.SQRT1_2
Math.LN2
Math.LN10
Math.LOG2E
Math.LOG10E
2、算术方法。

方法名	备注
round()	对一个数进行四舍五入。
random()	返回一个介于 0 和 1 之间的随机数。(0<=x<1)
floor()
ceil()

四十二、javaScript RegExp对象
1、正则表达式（regular expression）
2、语法：
（1）var patt=new RegExp(pattern, modifiers);//modifiers修饰符：是否全局，是否大小写。
（2）var patt=/pattern/modifiers;

JS浏览器BOM

四十三、javaScript window
1、浏览器对象模型BOM（Browser Object Model）
2、document也是window对象的属性之一。
3、window尺寸。
（1）对于Internet Explorer、Chrome、Firefox、Opera 以及 Safari：
window.innerHeight - 浏览器窗口的内部高度(包括滚动条)
window.innerWidth - 浏览器窗口的内部宽度(包括滚动条)
（2）对于 Internet Explorer 8、7、6、5：
document.documentElement.clientHeight
document.documentElement.clientWidth
或者：
document.body.clientHeight
document.body.clientWidth

//所有浏览器窗口的宽度和高度（不包括工具栏/滚动条）
var w=window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;

var h=window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;

4、其他window方法
（1）window.open()-打开新窗口
（2）window.close()-关闭当前窗口
（3）window.moveTo()-移动当前窗口
（4）window.resizeTo()-调整当前窗口的尺寸
四十四、javaScript window screen
1、window.screen对象包含有关用户屏幕的信息。
2、screen.availWidth - 可用的屏幕宽度。以像素计，减去界面特征，比如窗口任务栏。
screen.availHeight -可用的屏幕宽度
四十五、javascript window location
1、window.location对象用于获得当前页面的地址（url），并把浏览器重定向到新的页面。

方法名	作用	example
location.pathname	返回当前页面的路径和文件名。
location.href	返回当前页面的url	http://www.runoob.com/js/js-window-location.html
location.protocol	返回所使用的web协议	http://或https://
location.hostname	返回web主机的域名	www.runoob.com
location.port	返回web主机的端口	80（https默认端口为443）
location.pathname	返回url的路径名	/js/js-window-location.html
location.assign()	加载新的文档

四十六、javaScript window history
1、windwo.history对象包含浏览器的历史

方法名	备注
history.back()	加载历史列表的前一个url，与在浏览器点击后退按钮相同
history.forward()	与在浏览器中点击按钮向前相同

四十七、javaScript window navigator
1、

对象名	备注
window.navigator	包含有关访问者浏览器的信息
navigator.appCodeName	浏览器代号
navigator.appName	浏览器名称
navigator.appVersion	浏览器版本
navigator.cookieEnabled	启用Cookie
navigator.platform	硬件平台
navigator.userAgent	用户代理
navigator.systemLanguage	用户代理语言

2、来自navigator对象的信息具有误导性，不应该被用于检测浏览器版本，因为：
（1）navigator数据可被浏览器使用者更改。
（2）一些浏览器对测试站点会识别错误。
（3）浏览器无法报告晚于浏览器发布的新操作系统。
3、只有opera属性支持window.opera，可以由此识别出opera

if (window.opera) {...some action...}

四十八、javascript弹窗
1、可以在javascript中创建三种消息框：警告框，确认框，提示框。
2、警告框经常用于确保用户可以得到某些信息。
当警告框出现后，用户需要点击确定按钮才能继续进行操作。
3、确认框
确认框通常用于验证是否接受用户操作。
当确认框弹出时，用户可以点击“确认”或者“取消”来确定用户操作。
当你点击“确认”，确认框返回true，如果点击“取消”，确认框返回false。
4、提示框
提示框通常用于提示用户在进入页面前输入某个值。
当提示框出现后，用户需要输入某个值，然后点击确认或取消按钮才能继续操纵。
如果用户点击确认，那么返回值为输入的值。如果用户点击取消，那么返回值为null。
5、换行。
弹窗使用反斜杠（\n）来设置换行。
四十九、 计时事件
1、setInterval()-间隔指定的毫秒数不停地执行指定的代码。
2、setTimeout()-暂停指定的毫秒数后执行指定的代码。
3、clearInterval()
要使用clearInterval()方法，在创建计时方法时你必须使用全局变量。

myVar=setInterval("javascript function",milliseconds);
function myStopFunction(){
	clearInterval(myVar);
}

4、clearTimeout()
要使用clearTimeout()方法，你必须在创建超时方法中（setTimeout）使用全局变量。
如果函数还未执行，你可以使用clearTimeout()方法来停止执行函数代码。

var myVar;
function myFunction(){
	myVar=setTimeout(function(){alert("hello")},3000);
}
function myStopFunction(){
	clearTimeout(myVar);
}

五十、JavaScript cookie
1、cookie是一些数据，存储在你电脑上的文本文件中。
2、cookie的作用就是用于解决“如何记录客户端的用户信息”：
（1）当用户访问web页面时，他的名字可以记录在cookie中。
（2）在用户下一次访问该页面时，可以在cookie中读取用户访问记录。
3、cookie以名/值对形式存储，如下所示：
username=John Doe
4、1）创建cookie
（1）创建cookie

document.cookie="username=John Doe";

（2）可以为cookie添加一个过期时间（以UTC或GMT时间）。默认情况下，cookie在浏览器关闭时删除：

document.cookie="username=John Doe;expires=Thu, 18 Dec 2013 12:00:00 GMT";

（3）可以使用path参数告诉浏览器cookie的路径。默认情况下，cookie属于当前页面。

document.cookie="username=John Doe;expires=Thu,18 Dec 2013 12:00:00 GMT;path=/"

2）读取cookie

var x=document.cookie;

3)使用js修改cookie
在js中，修改cookie类似于创建cookie，如下：

document.cookie="usrname=John Smith;expires=Thu,18 Dec 2013 12:00:00 GMT;path=/"

旧的cookie将被覆盖。
4）js删除cookie
删除cookie非常简单。您值需要设置expires参数为以前的时间即可。

document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT";

注意，当你删除时不必指定cookie的值。
5、cookie字符串
document.cookie属性看起来像一个普通的文本字符串，其实它不是。
6、(1）设置cookie值的函数：

function setCookie(cname,cvalue,exdays)
{
  var d = new Date();
  d.setTime(d.getTime()+(exdays*24*60*60*1000));
  var expires = "expires="+d.toGMTString();
  document.cookie = cname + "=" + cvalue + "; " + expires;
}

(2)获取cookie值的函数

function getCookie(cname)
{
  var name = cname + "=";
  var ca = document.cookie.split(';');
  for(var i=0; i<ca.length; i++) 
  {
    var c = ca[i].trim();
    if (c.indexOf(name)==0) return c.substring(name.length,c.length);
  }
  return "";
}

（3）检测cookie值的函数：

function checkCookie()
{
  var username=getCookie("username");
  if (username!="")
  {
    alert("Welcome again " + username);
  }
  else 
  {
    username = prompt("Please enter your name:","");
    if (username!="" && username!=null)
    {
      setCookie("username",username,365);
    }
  }
}

js库

五十一、javaScript测试jQuery
1、jQuery 返回 jQuery 对象，与已传递的 DOM 对象不同。
2、jQuery 对象拥有的属性和方法，与 DOM 对象的不同。
3、不能在 jQuery 对象上使用 HTML DOM 的属性和方法。
4、jQuery允许链接（链式语法）。
链接（chaining）是一种在同一对象上执行多个任务的便捷方法。
五十二、javaScript测试prototype

function myFunction(){
$("h01").insert("Hello Prototype!");}
Event.observe(window,"load",myFunction);

1、event.observe()接受三个参数：
（1）您希望处理的html dom或bom对象。
（2）您希望处理的事件。
（3）您希望调用的函数。

js实例

五十三、javaScript实例
1、创建对象的实例

person={firstname:"John",lastname:"Doe",age:50,eyecolor:"blue"}
document.write(person.firstname + " is " + person.age + " years old."

2、创建用于对象的模板

function person(firstname,lastname,age,eyecolor){
	this.firstname=firstname;
	this.lastname=lastname;
	this.age=age;
    this.eyecolor=eyecolor;
}
myFather=new person("John","Doe",50,"blue");
document.write(myFather.firstname + " is " + myFather.age + " years old.");

五十四、javaScript对象实例
1、javaScript对象实例：
String（字符串）对象
Date（日期）对象、
Array（数组）对象、
Boolean（布尔）对象、
Math（算术）对象
五十五、javaScript浏览器对象实例
1、JavaScript Browser 对象 实例：
Window对象
Navigator对象
Screen对象
History对象
Location对象
五十五、javaScript html dom实例
1、JavaScript 对象 实例：使用内置JavaScript的对象实例。
Document对象
Anchor对象
Area对象
Base对象
Button对象
Form对象
Frame/Iframe对象
Image对象
Event对象
Option和Select对象
Table, TableHeader, TableRow, TableData 对象

js函数

五十七、javaScript 参考手册
1、javaScript对象： https://www.runoob.com/jsref/jsref-tutorial.html
2、HTML DOM对象： https://www.runoob.com/jsref/dom-obj-document.html