1、JS 命名规范
命名规范是很有必要的，可增强代码的可读性，一眼就能看懂要表达的意思，规范就是符合规则，使代码有利于后期维护，也能很大程度的提高开发效率。一个正常的网站有很多 JS 代码，如果在编写的过程中，不遵循某种规则，那么写到后面自己都看不懂自己写的什么，这是很麻烦的一件事，所以要在平时的练习过程中，养成良好的编写代码的习惯。
一般都采用匈牙利命名法或者驼峰命名法。
匈牙利命名法的原则：变量名=属性+类型+对象描述。他的关键是：以一个或多个小写字母作为前缀，前缀之后是一个或多个首字母大写的单词组合，该单词指明变量的用途。
驼峰命名法的原则：第一个单词以小写字母开始，之后每一个单词的首字母大写。例如：myFirstName、myLastName，这样的变量名看上去就像驼峰一样此起彼伏，因此得名。驼峰法的关键是：除第一个单词外，其他单词首字母大小，混合使用大小写字母来构成变量名和函数名，还可以使用下划线来形成逻辑断点，这样更能增强代码的可读性。
使用什么样的命名规范，还要要看个人喜好，或者公司规定。注意：在命名时不能使用保留字和太长不容易记忆的名称，要避免使用两个相似的变量名。下面是一些常用的匈牙利命名法的前缀：
| 类型 | 前缀 | 类型 | 实例 |
| 数组 | a | Array | aItems（项目） |
| 字符串 | s | String | sUserName |
| 函数 | fn | Function | fnHandler（处理程序） |
| 对象 | o | Object | oDiv |
| 整数 | i | Integer | iItemCount（项目计数） |
| 浮点数 | f | Float | fPrice（价格） |
| 布尔值 | b | Boolean | bIsComplete（完成） |
| 正则表达式 | re | RegExp | reEmailCheck（邮件检测） |
2、注释很重要
JS中单行注释用“ // 注释内容” 标识，多行注释使用“ /* 注释内容 */ “标识。注释的作用是提高代码的可读性，不仅自己以后用着方便，也有助于别人阅读和理解你所编写的JS代码，注释中的内容不会在网页中显示。为了方便阅读，注释一般放在需要解释的语句结尾处或者周围。在学习的过程中，我们更要养成书写注释的良好习惯，有利于我们对于代码的理解，或者标记出当时比较模糊的概念，回头再做深入的定向学习，更牢固的掌握该知识点。
3、JS 语句和符号
JS 语句是发送给浏览器的命令。这些命令的作用是告诉浏览器要做的事情。JS 的执行规则是自上往下以行为单位的，一般情况下，每一行就是一个语句。比如：var a = 1+2; 这条语句先用 var 关键词，声明了变量 a，再将 1+2 的运算结果赋值给变量 a。这里需要注意 = 符号，在 JS 中并不是等号的意思，而是赋值。再比如：alert('hello'); 这是一条 JS 语句，一行的结束被认定为语句的结束，通常在结尾加上一个 ; 来表示语句的结束，如果有多行 JS 语句，每句结束都有 ;，则按顺序执行语句。注意：JS 中的代码和符号都必须在英文状态下输入，虽然 ; 也可以不写，但难免会遇到一些错误，浏览器会判定前一句和后一句是可以连在一起解释的，这样就导致了一些意想不到的错误。我们要养成良好的编程习惯，记得在必须加分号的地方一定不要忘记加上。
JS 对大小敏感，在编写JS代码时，需要留意是否关闭了大小写切换键。
4、JS 判断语句和 for 循环
if 判断语句和 for 循环在 JS 中使用非常频繁。
通常在写代码时，总是需要为不同的决定来执行不同的动作，在代码中就可以使用 if 条件语句来完成该任务。
在 JS 中，可以使用以下条件语句：
(1)、if 语句：只有当指定条件为 true 时，也就是条件成立时执行的代码。
(2)、if... else 语句：当条件成立时执行 if 后代码，条件不成立(为 false )时执行 else 后的代码。
(3)、if... else if.... else 语句：使用该语句根据判断条件来选择多个代码块之一来执行。
实例：根据不同的时间，提示不同的问候，当时间小于12点，问候早上好，当时间大于或等于12点小于18点，问候下午好，否则都问候晚上好。
1 <script> 2 var d = new Date(); 3 var time = d.getHours(); 4 if (time < 12){ 5 alert('早上好'); 6 } 7 else if (time >= 12 && time < 18){ 8 alert('下午好'); 9 } 10 else{ 11 alert('晚上好'); 12 } 13 </script>
如果希望一遍又一遍的运行相同的代码，并且每次的值都不同，那么使用循环是很方便的，当有一组元素的时候，就可以使用 for 循环为这一组元素添加事件。
for循环的语法：
1 for (语句 1; 语句 2; 语句 3){ 2 被执行的代码块 3 } 4 5 语句1用于初始化循环中所有的变量。通常为：var i=0; 6 语句2用于设置初始变量的条件。通常为：i<object.length; 7 语句3用于增加初始变量的值。通常为：i++ 也可以为：i--
实例：循环遍历数组中的数据，依次输出：
1 //在不使用循环时，我们可以这样输出数组中的值： 2 var cars=["路虎","宝马","奔驰","奥迪","别克","大众"]; 3 document.write(cars[0] + "<br>"); 4 document.write(cars[1] + "<br>"); 5 document.write(cars[2] + "<br>"); 6 document.write(cars[3] + "<br>"); 7 document.write(cars[4] + "<br>"); 8 document.write(cars[5] + "<br>"); 9 10 //使用for循环可以很简洁的完成输出： 11 for (var i=0, i<cars.length; i++){ 12 document.write(cars[i] + "<br>"); 13 }
document.write() 可用于直接向 HTML 输出流写内容，可以在平时做练习时用于向页面输出内容测试代码，这里需要注意 document.write() 一定要向文档输出写内容，如果文档已经加载完成后，再来执行该语句，则整个页面将会被覆盖。如果 document.write() 放在事件中，则会先清空页面上所有的内容，然后再写入内容。
5、JS 一些基本概念
(1)、标识符：标识符是 JS 中定义的符号，可以由任意顺序的大小写字母、数字、下划线、和美元符号( $ )组成。标识符就是识别一个具体对象的名称，最常见的标识符就是变量名和函数名，JS对大小写敏感，所以 a 和 A 是两个不同的标识符。标识符不能以数字开头，也不能是JS中的保留关键字，具体可百度参考资料。另外还有三个虽然不是保留字，但是因为他们具有特别的含义，也不能用作标识符：Infinity、NaN、undefined。
(2)、代码块：代码块其实不难理解，先来解释以下 JS 代码，JS 代码就是 JS 语句的序列，浏览器依据编写 JS 语句的顺序依次逐行的执行每个语句，而代码块则是 JS 语句的组合，并且包含在花括号内，代码块的作用是告诉浏览器这些代码一起执行语句序列。JS 函数就是将语句组合在块中的典型例子。
(3)、变量：从字面上来理解，变量就是可以改变的量，但是从编程角度讲，变量是用于存储某种/某些数值信息的“容器”，简单说就是对“值”的引用，使用变量等同于引用一个值，每一个变量都有一个变量名。比如：var x = 1; 先声明一个变量 x，x 就是变量名，然后用 = 赋值，也就是将 1 赋值给 x，以后，在引用 x 的时候，就会得到值 1。在 JS 中创建一个变量通常被称为“声明”一个变量，var 就是用来声明变量的。变量在声明之后是空的，他的值为undefined（未定义），需要给他赋值后使用，= 就是建立这种引用关系。上面的代码可以看作为：var x；x=1；这样写是先声明一个变量，再给其赋值，上面的代码则在声明的同时就进行了赋值。在一条语句中，可以声明多个变量，并使用逗号隔开。注意：在给变量命名的时候不能使用 JS 关键词和 JS 保留词。
(4)、常量：有变量就会有常量，变量可以理解为变化的量，而常量就是不变的量。其实在 JS 中并没有常量这个概念，所谓的常量，只不过是提前赋值的变量而已。常量和变量都属于变量，只不过常量是赋过值后就不能再改变的变量，而普通的变量可以再次进行赋值操作。为了与变量有所区分，增强代码的可读性，所以在声明一个常量时，一般采用常量名全部大写，若有多个单词，可用下划线隔开。
(5)、字面量：所谓的字面量，其实是对象的表示形式，或者说是创建方式，他不是一种值，而是一种表示值的记法，简单说字面量就是如何表达一个对象的值，在给变量赋值时，赋值运算符后面的都可以认为是字面量。字面量也叫直接量，一个字面量，也可以被认为是一个常量，如 100。这里需要注意：变量是一个名称，而字面量是一个值。字面量可分为：数字字面量、字符串字面量和表达式字面量。数字字面量，可以是整数或者是小数，比如：var a=10; var b=3.14; 10 和 3.14 就是数字字面量。字符串字面量，使用引号包含起来的一系列字符，比如：var str='小明'； '小明'就是字符串字面量。表达式字面量又可分为：数组字面量、对象字面量、函数字面量。数组字面量，每个值用逗号隔开，比如：var arr = [1,2,3,4,5,6]; [1,2,3,4,5,6] 就是数组字面量。对象字面量是一个键值对的组合，每个键值对之间用逗号分割，并包含在花括号内，比如：var obj = {a:12, b:5, c:'21'}， {a:12, b:5, c:'21'} 就是对象字面量。函数字面量，function myFunction(a, b) { return a * b;} 函数字面量是用关键字 function 后加可选的函数名、用圆括号括起来的参数和用花括号括起来的执行语句构成。函数字面量是一个表达式，而不是语句。上面的例子可写为：var myFunction = function (a, b) { return a * b;} ，这样就有便于理解了，也可以说函数的字面量就是一个匿名函数，他的指向是归谁使用。
(6)、变量的作用域：变量分为：全局变量和局部变量。全局变量简单说就是在函数外声明的变量，任何地方都可以使用，而局部变量就是在函数内部声明的变量，只能在声明他的函数内部使用。这就是变量的作用域，通俗理解就是他的作用范围。JS 变量的生命期从他们被声明的时候开始，全局变量会在页面被关闭之后删除，局部变量则在函数被运行以后删除。
(7)、表达式：表达式与数学中的定义相似，是指具有一定的值、用运算符把常量和变量连接起来的代数计算式，一个表达式可以包含常量或变量。比如：var a=a+1; a 是变量名称，a+1 就是表达式。在生活中”再见“表达方式有很多种，比如：英语(goodbey)，网络语(886)，肢体语言(摆摆手)等。JS 中的表达式无处不在，可以表达以下几种内容：字符串的连接，被称为串表达式，var str = "I" + "love" + "you"; 还有这种形式：var str = "hello"; var str1 = str + "World"; 串表达式值为字符串。数值表达式，var num = 10 + 2.5; 也有如下形式：var num = 10 + 2.5; var num1 = num + 10 * 2.5; 数值表达式值为数值。还是有一种是布尔表达式，var num = 2; alert(num == 2); 返回 ture，alert(num > 10); 返回 false。布尔表达式值为 true 或 false。
(8)、函数：一看到函数，很多人可能就头疼，但是编程中函数还是很好理解的，是由事件驱动的或者当它被调用时执行的可重复使用的代码块。简单说就是完成某个特定功能的一组语句，使用function关键字定义包裹在花括号中的代码块，便于反复调用。其基本形式为：function moveStart(){代码} 。声明一个函数只是在告诉浏览器这有一个函数，不会被实际执行，而在函数调用的时候，才真正执行函数内的代码。moveStart 就是函数名，遵循 JS 命名规范，在函数调用的时候使用：moveStart()。若将函数定义在变量后，变量则可作为函数使用。函数存储在变量中，不需要函数名，可以通过变量名调用。我们把没有名称的函数称为匿名函数。函数返回值，函数执行的结果就是函数返回值，return 可以将函数内的结果返回到函数外调用，在使用 return 语句时，函数会停止执行，并返回指定的值，再从调用的地方开始执行，函数调用会被返回值取代，同样一个函数应该只返回一种类型的值，在仅仅是希望退出函数时，也可以使用 return，返回值是可选的，比如下面的代码：如果 a 大于 b，则退出函数，并不会计算 a 和 b 的和。
1 function myFunction(a, b){ 2 if (a > b){ 3 return; 4 } 5 x = a+b; 6 }
(9)、函数传参：在调用函数时，可以向其传递值，这些值被称为参数，这些参数可以在函数中使用，可以传递任意多的参数，并由逗号分割，比如：function myFunction(x, y){return x * y;} ，在调用的时候传入值：myFunction(3 ,4)，则返回 x乘y 的运算结果。简单理解，参数就是一个占位符，即先把位置占住，后面再用。传递的值必须与参数以一致的顺序出现，第一个值就是第一个被传递的参数给定的值，依次类推。函数很灵活，可以传递不同的值，来调用该函数。函数参数可分为：显式参数和隐藏参数( arguments )。函数的显式传参，也叫固定参，就是在函数被声明定义的时候列出的参数。隐藏参数也叫可变参，或者不定参，arguments 对象是 JS 内置的对象，对象包含了函数调用的参数数组，通过这一点可以很方便的找到最后一个参数的值，或者计算所有参数的和。当函数里有一部分定不下来的时候可以用函数传参，举一个简单的例子：点击按钮改变 DIV 的样式：
1 <style> 2 #div1{ 3 200px; 4 height:200px; 5 background:red; 6 } 7 </style> 8 <body> 9 <div id="div1"></div> 10 <input type="button" value="变宽" onclick="setWid('width','400px')" /> 11 <input type="button" value="变高" onclick="setWid('height','400px')" /> 12 <input type="button" value="变绿" onclick="setWid('background','green')" /> 13 <script> 14 function setWid(name, value){ //函数传参 15 var x = document.getElementById('div1'); 16 x.style[name] = value; 17 } 18 </script> 19 </body>
1 //参数求和： 2 <script> 3 function sumArr() { 4 var result = 0; 5 for(var i = 0; i < arguments.length; i++) { 6 result += arguments[i]; 7 } 8 return result; 9 } 10 alert(sumArr(3,5,2,12,8,51,99)); //和为：180 11 </script>
(10)、对象：在现实生活中，一个人可以被视为一个对象，对象有他的属性，比如性别、身高、年龄，籍贯等，方法有：走、跑、跳等。所有的人都有这些属性，但是每个人的属性又不尽相同，所有的人都有这些方法，但是他们执行的时间都不尽相同。在 JS 中，对象就是拥有属性和方法的数据，JS 中的所有事物都是对象：字符串、日期、数组、数字等等。可以说在 JS 中一切皆对象，属性是与对象相关的值，方法是能够在对象上执行的动作。简单说对象只是带有属性和方法的特殊数据类型。在 JS 中对象是数据（变量），拥有属性和方法，当在声明一个变量时，var txt = "你好"； 实际上已经创建了一个字符串对象，该对象拥有 length 属性，字符串对象同时拥有很多个内置的方法，比如：charAt() 可获取某个字符，返回字符串的某一位的字符。可以说 JS 对象是变量的容器，但是，通常认为 JS对象是键值对的容器，键值对的写法为：name:value，键与值以冒号分隔，键值对又常被称为对象属性，所以 JS 对象就是属性变量的容器。JS支持自定义对象，可以通过 new 关键字创建。
6、JS 数据类型
JS 数据类型可分为基本数据类型和复合数据类型两种，其中基本数据类型有五种：字符串（String）、数字(Number)、布尔(Boolean)、空（Null）、未定义（Undefined）。复合数据类型即 Object，Object 本质是一组无序的名值对组成的，严格来说，又被分为三类：对象(Object)、数组(Array)、函数（function）。
(1)、字符串：字符串是存储字符的变量。比如：var a='小明';，字符串可以是引号中的任意文本，可以使用单引号或者双引号。
(2)、数字：数字就是用来存储数字的变量。可以为整数也可以是小数。比如：var a1=314; var a2=3.14；。
(3)、布尔：布尔值是 "ture" 真和 "false" 假两个特定值，布尔常用在条件测试中。
什么是真 ture：非零数字、非空字符串、非空对象
什么是假 false：数字零、空字符串、空对象(null)、undefined
(4)、Null：null 是一个只有一个值的特殊类型，表示一个空对象引用，可以用来清空变量。
(5)、Undefined：表示为定义，有两种情况：1：真的没有定义。2、虽然定义了，但是没有赋值。
(6)、Object：对象由大括号包含。在括号内部，对象的属性以名称和值对的形式{name : value}来定义。属性由逗号分隔，包括了除数字、字符串和布尔值以外的所有类型。比如：var person = {name:"小明", sex:"男", id:5566};，此例子中的对象（person）有三个属性：name， sex，id。
(7)、Array：使用单独的变量名来存储一系列的值。创建一个数组的方法：var arr = new Array();，之后可以给数组添加值：arr[0] = 1; arr[1] = 2; arr[2] = 3;，数组的下标是基于零的，所以从 0 开始算起。在 JS 中，很多时候，要避免使用 new 关键字，所以将数组创建为：var arr = [1,2,3] 的形式。
(8)、function：函数其实是处理数据的方法，JS 将函数视为一种数据类型，可以像其他数据类型一样，进行赋值和传递，这就为编程带来了很大的灵活性。
变量的类型：变量本身是没有类型的，取决于他里边存储的什么数据类型，存的什么类型就是什么类型的变量。当声明新变量时，可以使用 new 来声明其类型，比如：var userName = new String; var x = new Number; var y = new Boolean; var cars = new Array; var person = new Object; 。JS 变量均为对象，当声明一个变量时，就创建了一个新的对象。
typeof运算符：typeof 操作符用来检测变量的数据类型，返回一个字符串。字符串、数字、布尔值分别返回 string、number、boolean。用 typeof 检测 null 返回 object，在 JS 中 null 表示什么都没有，但是他是一个对象。undefined 是没有赋值的变量，所以 typeof 一个没有值的变量会返回 undefined。typeof 一个对象则返回 object。JS 中数组是一种特殊类型的对象，所以也返回 object。函数则返回 function。
undefined 和 null 的区别：typeof undefined，返回 undefined。typeof null，返回 object。(null === undefined)，返回 false，(null == undefined)，返回true。
7、JS 运算符
(1)、算数运算符：
除了平时常见的加减乘数之外，JS 中还有一些其他的运算符：
取模运算符：%，取模通俗理解就是取余数，比如：5%2，值为1，5除2，商2余1。
自增运算符：++，自增运算分为两种情况，一种是先赋值再运算，一种是先运算再赋值。实例：假设 a = 2
先赋值再运算：var b = a++; 运算结果为：b=2，a=3 解析：b = a，a = a+1。
先运算再赋值：var b = ++a；运算结果为：b=3，a=3 解析：a = a+1，b = a。
通过上面的例子，可以看到，先赋值再运算，实质是先把 a 赋值给 b，然后自己再加 1。先运算再赋值，实质是先自己加 1，再把值赋给 b。
他们的相同点都是自增1，a = a+1，都被作为一个整体表达式运算，即 (a++)(++a)，虽然他们的值都自增 1，但是 (a++) 取 a 自增前的值，而 (++a) 取 a 自增后的值。
自减运算符：--，自减运算符和自增运算符一样，即每次自减1。也分为两种情况：实例：假设a=2
先赋值再运算：var b=a--; 运算结果为：b=2，a=1 解析：b=a，a=a-1。
先运算再赋值：var b=--a；运算结果为：a=1，b=1 解析：a=a-1，b=a。
+ 运算符可用于字符串变量的连接，若需要把多个字符串连接起来，就可以使用 + 运算符。
如果把字符串和数字相加，则得到一个字符串。比如：var str='hello'+2; 返回：hello2
(2)、赋值运算符：
赋值运算符用于给变量赋值。有以下几种：= += -= *= /= %=
实例：假设 a=10 b=5
=：a = b 结果：5
+=：a += b，相当于：a = a+b 结果：15
-=：a -= b，相当于：a = a-b 结果：5
*=：a *= b，相当于：a = a*b 结果：50
/=：a /= b，相当于：a = a/b 结果：2
%=：a % b，相当于：a = a/b 结果：0 (取模运算是取余数)
(3)、比较运算符：
比较运算符在条件语句中使用，用于判断变量或值的关系，返回 ture 或 false。
比较运算符有以下几种：== === != !== > < >= <=
实例：假设 a=2
==：等于。注意双等号在JS中才表示等于，一个等号为赋值。比较：a == 2，返回 ture。a == 1，返回false。
===：绝对等于，值和类型均相等。比较：a === '2'，返回 false。a === 2，返回 true。
!=：不等于。和等于相反。比较：a != 2，返回 false，a != 1，返回 ture。
!==：绝对不等于，和绝对等于相反，值和类型均不相等。比较：a !== '2'，返回 ture，a !== 2，返回 false。
>：大于。比较：a>5，返回false。
<：小于。比较：a<5，返回ture。
>=：大于等于。比较：a>=5，返回false。
<=：小于等于。比较：a<=5，返回ture。
(4)、逻辑运算符：
逻辑运算符用于描述变量或值之间的逻辑关系。
逻辑运算符有以下几种：&& || !
&&：并且。在数学中我们将 b 大于 a、b 又小于 c 表示为：a<b<c，但是在 JS 中要用 && 表示：b>a && b<c。两个条件必须同时满足，则返回 ture，有一个条件不满足，则返回 false。实例：判断一个数字是否为两位数：a>9 && a<100，假设 a=50，则返回：ture。
||：或。当两个条件中，有任一个条件满足，逻辑或的运算结果就为真。实例：a=5，b=10，判断c=a<b || a==b，c的值为：ture。
!：否。也叫逻辑非操作符，是非颠倒，好比小明买了一本 JS 书籍，小白说：是乌龟书；小红说：是犀牛书。小明说：小白说的不是真话，小红说的不是假话。那么是小红说对了，小明买的书是犀牛书。实例：a=10 b=5，判断c =! (a>b)，c 的值为：false。
(5)、三元运算符：
三元运算符也叫条件运算符，其基本形式可用 if 判断语句表示，用三元运算符表示为： ？ ：。
所谓三元运算符，顾名思义就是需要进行三次操作，语法为：条件?结果1:结果2 。条件写在问号之前，后面跟着用冒号分隔的结果1和结果2，当满足条件时为结果1，否则就是结果2。好比你去看演唱会，条件就是需要入场券，若你带了就可以直接进去，如果没带那就请回吧，用三元运算符可表示为：带没带入场券 ? 带了直接进去 : 没带那就请回吧。
所有使用 if 判断语句的地方，都可以使用三元运算符，使用 if 判断语句代码比较繁琐，使用三元运算符，代码则十分简洁，但是对于初学者来说，三元运算符不是那么直观，使用 if 判断语句更容易理解，随着学习的不断深入，以及理解的加深，就可以使用三元运算符代替 if 了。
实例：判断一个数为偶数还是奇数。假设：a=12
先用 if 判断语句表示：
1 var a = 12; 2 if(a%2 == 0){ 3 alert('a为偶数'); 4 } 5 else{ 6 alert('a为奇数'); 7 }
用三元运算符可表示为：
1 var a = 12; 2 a%2===0 ? alert('偶数') : alert('奇数');
(6)、运算符之间的优先级：
从高到低依次为：算术操作符 → 比较操作符 → 逻辑操作符 → "="赋值符号
同级的运算是按从左到右依次进行运算，若有括号，从多层括号由里向外进行运算。
实例：
1 var numA = 2; 2 var numB = 5; 3 4 var numC = numA + 40 > 10 $$ numB * 2 < 20; 5 var numD =( ( numA + 40 ) / ( 12 - numB ) ) * 10; 6 7 alert(numC); //返回：ture 8 alert(numD); //返回：60
8、JS 事件
HTML 事件是发生在 HTML 元素上的事情。当在 HTML 页面中使用 JS 时，JS 可以触发这些事件。事件可以是浏览器行为，也可以是用户操作行为，用户操作行为可分为鼠标操作和键盘操作。比如：在页面加载完成时触发事件，这属于浏览器行为，用户的操作行为如点击按钮触发事件，鼠标的移入移出，按键提交信息等。
下面是一些常用的事件列表：
| 事件 | 描述 |
| onload | 页面已完成加载时触发事件 |
| onresize | 调整浏览器大小时触发事件 |
| onchange | 当元素改变时触发事件 |
| onfocus | 当元素获得焦点时触发事件 |
| onselect | 当选取元素时触发事件 |
| onsubmit | 用户提交表单时触发事件 |
| onclick | 点击鼠标时触发事件 |
| onmouseover | 鼠标移入时触发事件 |
| onmouseout | 鼠标移出时触发事件 |
| onmousedown | 按下鼠标时触发事件 |
| onmouseup | 松开鼠标时触发事件 |
| onmousemove | 移动鼠标时触发事件 |
| onmousewheel | 用户滚动鼠标滚轮时触发事件 |
| onscroll | 当滑动滚动条时触发事件 |
| onkeydown | 用户按下键盘按键时触发事件 |
| onkeyup | 用户松开按键时触发事件 |
9、JS 常用的互动方法
在 JS 中可以创建三种类型的消息框：警告框、确认框、提示框。
(1)、警告框
警告框常用于确保用户可以得到某些信息，平时我们在访问网页的时候，有时突然弹出一个小窗口，上面写这一些提示文字，这就是警告框，在警告框出现之后，用户必须点击确定按钮后才能继续操作，否则就不能对网页做出任何操作。这样的弹出窗口是用”alert“实现的。
语法：alert(str或var);
(2)、确认框
确认框常用于验证用户是否接受操作，允许用户做出选择，当确认框弹出时，用户可以点击”确定“或者”取消“来确定用户操作，当用户点击确定时，返回值为 ture，如果点击取消，则返回值为 false。用户在点击对话框之前不能进行任何操作。这样的弹出窗口是用”confirm“实现的。
语法：confirm(str);
(3)、提示框
提示框也叫提问框，用于提示用户在进入页面前输入某个值，主要是询问一些需要与用户交互的信息，提示框包含一个确定、取消按钮，和一个文本框，当提示框弹出后，用户需要输入某个值，然后点击确定或者取消才能继续操作，当用户点击确认时，返回值为文本框输入的值，如果用户点击取消，则返回值为null。提示框可以和确认框相互配合使用。这样的弹出窗口是用”prompt“实现的。
语法：prompt(str1, str2);
str1 为要显示在对话框的值，也就是与用户交互的内容描述，不可修改。str2 为文本框中提示用户输入的默认内容，可以修改。
一般情况下，在实际的网站中，这些对话框都很少或者说几乎不使用，尤其是警告框，因为用户会反感这种突然弹出来的东西，在弹出对话框后用户不点击按钮之前，浏览器就跟死了一样，不能做任何操作，确认框和提示框相对来说还有一些使用，也是比较有意义的，比如页面中一个跳转按钮，如果不使用确认对话框，则直接跳转到新页面，使用确认对话框之后，用户可以点击确认或者取消来执行对应操作，确认则跳转新页面，取消则继续浏览，有时候这个跳转按钮或者链接是用户不小心点到的，并不希望跳转。大部分网站中，都使用的是一套自定义的对话框，更友好的显示。
10、JS 转义字符
在 JS 中字符串通常用单引号或双引号包含起来，比如：var txt = "谁看到"小明"今天来上课了吗？"; 所以这个例子会解析错误，从 "谁看到" 被截断，浏览器报错提示：语法错误，而且这是很严重的错误，错误到代码将被终止，后面的代码无法执行。其实这个例子还是很好解决的，我们可以将其用单引号括起来，再给小明加上双引号，OK，跟原来要表达的一样，但是如果我们需要换行呢？这时候就需要用到转义字符，转义字符在 JS 中应用十分广泛，尤其是在正则表达式 (RegExp) 中，因此上面的代码应该写为： var txt = "谁看到 \"小明 \"今天来上课了吗？"; 需要换行则写为：var txt = "谁看到 \"小明 \" \n 今天来上课了吗？"; 。
反斜杠(\)是一个转义字符，转义字符可用于将特殊字符转换为字符串字符，可以用于转义撇号、引号、换行等其他特殊字符，在编写代码时需要注意特殊字符问题，很多运行时出现的问题都是因为特殊字符而引起的，由于反斜杠本身被用作转义符，因此不能在代码中只键入一个 \ ，如果需要显示一个反斜杠，必须一次键入两个 \\ 。下面是一些常用的转义字符：
| 转义代码 | 输出 |
| \' | 单引号 |
| \" | 双引号 |
| \\ | 反斜杠 |
| \n | 换行符 |
| \r | 回车符 |
| \b | 退格符 |
| \t | tab制表符 |
| \f | 换页符 |