使用 window.alert() 弹出警告框。
使用 document.write() 方法将内容写到 HTML 文档中。
使用 innerHTML 写入到 HTML 元素。
使用 console.log() 写入到浏览器的控制台。
值类型(基本类型)：
字符串（String）
数字(Number)
布尔(Boolean)
对空（Null）
未定义（Undefined）
Symbol（Symbol 是 ES6 引入了一种新的原始数据类型，表示独一无二的值）
引用数据类型：
对象(Object)
数组(Array)
函数(Function)
5 种不同的数据类型：string number boolean object function
3 种对象类型：Object Date Array
2 个不含任何值的数据类型：null undefined
JavaScript 拥有动态类型。这意味着相同的变量可用作不同的类型
Undefined 这个值表示变量不含有值。
可以通过将变量的值设置为 null 来清空变量。
null 和 undefined 的值相等，但类型不等
当声明新变量时，可以使用关键词 "new" 来声明其类型
对象键值对的写法类似于：
PHP 中的关联数组
Python 中的字典
C 语言中的哈希表
Java 中的哈希映射
Ruby 和 Perl 中的哈希表
onchange HTML 元素改变
onclick 点击 HTML 元素
onmouseover 在一个HTML元素上移动鼠标
onmouseout 从一个HTML元素上移开鼠标
onkeydown 按下键盘按键
onload 浏览器已完成页面的加载
for 循环代码块一定的次数
for/in 循环遍历对象的属性
while 当指定的条件为 true 时循环指定的代码块
do/while 同样当指定的条件为 true 时循环指定的代码块
JavaScript for/in 语句循环遍历对象的属性
for (x in person) { // x 为属性名
txt=txt + person[x];
}
document.forms["myForm"]["fname"].value;
得在form里面家加onsubmit事件。
HTML 表单自动验证：required 属性。
在方法中，this 表示该方法所属的对象。
如果单独使用，this 表示全局对象。
在函数中，this 表示全局对象。
在函数中，在严格模式下，this 是未定义的(undefined)。
在事件中，this 表示接收事件的元素。
类似 call() 和 apply() 方法可以将 this 引用到任何对象。
在 JavaScript 中，正则表达式通常用于两个字符串方法 : search() 和 replace()
search() 方法 用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串，并返回子串的起始位置。
replace() 方法 用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。
正则表达式修饰符（可以在全局搜索中不区分大小写）
i 执行对大小写不敏感的匹配。
g 执行全局匹配（查找所有匹配而非在找到第一个匹配后停止）。
m 执行多行匹配。
正则表达式模式（方括号用于查找某个范围内的字符）
[abc] 查找方括号之间的任何字符。
[0-9] 查找任何从 0 至 9 的数字。
(x|y) 查找任何以 | 分隔的选项。
元字符是拥有特殊含义的字符：
\d 查找数字。
\s 查找空白字符。
\b 匹配单词边界。
\uxxxx 查找以十六进制数 xxxx 规定的 Unicode 字符。
量词:
n+ 匹配任何包含至少一个 n 的字符串。
n* 匹配任何包含零个或多个 n 的字符串。
n? 匹配任何包含零个或一个 n 的字符串。
charAt()返回指定索引位置的字符
charCodeAt()返回指定索引位置字符的 Unicode 值
concat()连接两个或多个字符串，返回连接后的字符串
fromCharCode()将 Unicode 转换为字符串
indexOf()返回字符串中检索指定字符第一次出现的位置
lastIndexOf()返回字符串中检索指定字符最后一次出现的位置
localeCompare()用本地特定的顺序来比较两个字符串
match()找到一个或多个正则表达式的匹配
replace()替换与正则表达式匹配的子串
search()检索与正则表达式相匹配的值
slice()提取字符串的片断，并在新的字符串中返回被提取的部分
split()把字符串分割为子字符串数组
substr()从起始索引号提取字符串中指定数目的字符
substring()提取字符串中两个指定的索引号之间的字符
toLocaleLowerCase()根据主机的语言环境把字符串转换为小写，只有几种语言（如土耳其语）具有地方特有的大小写映射
toLocaleUpperCase()根据主机的语言环境把字符串转换为大写，只有几种语言（如土耳其语）具有地方特有的大小写映射
toLowerCase()把字符串转换为小写
toString()返回字符串对象值
toUpperCase()把字符串转换为大写
trim()移除字符串首尾空白
valueOf()返回某个字符串对象的原始值
let 声明的变量只在 let 命令所在的代码块内有效。
const 声明一个只读的常量，一旦声明，常量的值就不能改变。
在 ES6 之前，JavaScript 只有两种作用域： 全局变量 与 函数内的局部变量。
使用 var 关键字声明的变量不具备块级作用域的特性
let 声明的变量只在 let 命令所在的代码块 {} 内有效，在 {} 之外不能访问。
重新定义变量
使用 var 关键字重新声明变量可能会带来问题。
在块中重新声明变量也会重新声明块外的变量。
let 关键字就可以解决这个问题，因为它只在 let 命令所在的代码块 {} 内有效。
重置变量
使用 var 关键字声明的变量在任何地方都可以修改。
在相同的作用域或块级作用域中，不能使用 let 关键字来重置 var 关键字声明的变量。
在相同的作用域或块级作用域中，不能使用 let 关键字来重置 let 关键字声明的变量。
在相同的作用域或块级作用域中，不能使用 var 关键字来重置 let 关键字声明的变量。
let 关键字在不同作用域，或不同块级作用域中是可以重新声明赋值的。
变量提升
JavaScript 中，var 关键字定义的变量可以在使用后声明，也就是变量可以先使用再声明
let 关键字定义的变量则不可以在使用后声明，也就是变量需要先声明再使用。
循环作用域
局部变量
全局变量
在 HTML 中, 全局作用域是针对 window 对象。
使用 var 关键字声明的全局作用域变量属于 window 对象。
使用 let 关键字声明的全局作用域变量不属于 window 对象。
const 关键字（IE10 及更早版本的浏览器不支持 const 关键字）
const 用于声明一个或多个常量，声明时必须进行初始化，且初始化后值不可再修改。
const 定义常量与使用let 定义的变量相似
二者都是块级作用域
都不能和它所在作用域内的其他变量或函数拥有相同的名称
两者还有以下两点区别
const 声明的常量必须初始化，而let声明的变量不用。
const 定义常量的值不能通过再赋值修改，也不能再次声明。而 let 定义的变量值可以修改。
并非真正的常量
const 的本质: const 定义的变量并非常量，并非不可变，它定义了一个常量引用一个值。
使用 const 定义的对象或者数组，其实是可变的。但是不能对常量对象和数组重新赋值。
在相同的作用域或块级作用域中，不能使用 const 关键字来重置 var 和 let 关键字声明的变量。
在相同的作用域或块级作用域中，不能使用 const 关键字来重置 const 关键字声明的变量。
const 关键字在不同作用域，或不同块级作用域中是可以重新声明赋值的。
const 关键字定义的变量则不可以在使用后声明，也就是变量需要先声明再使用。
JSON 是用于存储和传输数据的格式。
JSON 通常用于服务端向网页传递数据 。
JSON 格式化后为 JavaScript 对象
JSON 语法规则
数据为 键/值 对。
数据由逗号分隔。
大括号保存对象。
方括号保存数组。
JSON 数据（一个名称对应一个值）
JSON 对象
JSON 对象（保存在大括号内）
JSON 数组（数组保存在中括号内）
JSON.parse() 用于将一个 JSON 字符串转换为 JavaScript 对象。
JSON.stringify() 用于将 JavaScript 值转换为 JSON 字符串。
void(0) 含义
void 是 JavaScript 中非常重要的关键字，该操作符指定要计算一个表达式但是不返回值。
href="#" 与 href="javascript:void(0)" 的区别
# 包含了一个位置信息，默认的锚是 #top 也就是网页的上端。
而 javascript:void(0) 仅仅表示一个死链接。
在页面很长的时候会使用 # 来定位页面的具体位置，格式为：# + id。
如果要定义一个死链接请使用 javascript:void(0)。
函数提升（Hoisting）
提升（Hoisting）是 JavaScript 默认将当前作用域提升到前面去的的行为。
提升（Hoisting）应用在变量的声明与函数的声明。因此，函数可以在声明之前调用。
自调用函数
函数表达式可以 "自调用"，自调用表达式会自动调用。
如果表达式后面紧跟 () ，则会自动调用。
不能自调用声明的函数。
通过添加括号，来说明它是一个函数表达式：
(function () {
var x = "Hello!"; // 将调用自己
})();
函数可作为一个值使用
函数是对象
箭头函数（ES6 新增，IE11 及更早 IE 版本不支持箭头函数）
当只有一个参数时，圆括号是可选的。
没有参数的函数应该写成一对圆括号。
// ES5
var x = function(x, y) {
return x + y;
}
// ES6
const x = (x, y) => x + y;
有的箭头函数都没有自己的 this。 不适合顶一个 对象的方法。
当使用箭头函数的时候，箭头函数会默认帮我们绑定外层 this 的值，所以在箭头函数中 this 的值和外层的 this 是一样的。
箭头函数是不能提升的，所以需要在使用之前定义。
使用 const 比使用 var 更安全，因为函数表达式始终是一个常量。
如果函数部分只是一个语句，则可以省略 return 关键字和大括号 {}，这样做是一个比较好的习惯。
函数显式参数(Parameters)与隐式参数(Arguments)
函数显式参数在函数定义时列出。
函数隐式参数在函数调用时传递给函数真正的值。
参数规则
JavaScript 函数定义显式参数时没有指定数据类型。
JavaScript 函数对隐式参数没有进行类型检测。
JavaScript 函数对隐式参数的个数没有进行检测。
默认参数
ES5 中如果函数在调用时未提供隐式参数，参数会默认设置为： undefined
有时这是可以接受的，但是建议最好为参数设置一个默认值。
如果函数调用时设置了过多的参数，参数将无法被引用，因为无法找到对应的参数名。 只能使用 arguments 对象来调用。
ES6 函数可以自带参数（重载）。
ES6 支持函数带有默认参数，就判断 undefined 和 || 的操作。
Arguments 对象
JavaScript 函数有个内置的对象 arguments 对象。
argument 对象包含了函数调用的参数数组。
通过这种方式可以很方便的找到最大的一个参数的值。
通过值传递参数
在函数中调用的参数是函数的隐式参数。
JavaScript 隐式参数通过值来传递：函数仅仅只是获取值。
如果函数修改参数的值，不会修改显式参数的初始值（在函数外定义）。
隐式参数的改变在函数外是不可见的。
通过对象传递参数
在JavaScript中，可以引用对象的值。
因此我们在函数内部修改对象的属性就会修改其初始的值。
修改对象属性可作用于函数外部（全局变量）。
修改对象属性在函数外是可见的。
JavaScript 函数有 4 种调用方式
每种方式的不同在于 this 的初始化。
this 关键字
在Javascript中，this 指向函数执行时的当前对象。
作为一个函数调用
不属于任何对象。但是在 JavaScript 中它始终是默认的全局对象
在 HTML 中默认的全局对象是 HTML 页面本身，所以函数是属于 HTML 页面。
全局对象
当函数没有被自身的对象调用时 this 的值就会变成全局对象。
在 web 浏览器中全局对象是浏览器窗口（window 对象）。
该实例返回 this 的值是 window 对象。
使用构造函数调用函数
如果函数调用前使用了 new 关键字, 则是调用了构造函数。
这看起来就像创建了新的函数，但实际上 JavaScript 函数是重新创建的对象。
构造函数的调用会创建一个新的对象。新对象会继承构造函数的属性和方法。
构造函数中 this 关键字没有任何的值，this 的值在函数调用实例化对象(new object)时创建。
作为函数方法调用函数
在 JavaScript 中, 函数是对象。JavaScript 函数有它的属性和方法。
call() 和 apply() 是预定义的函数方法。 两个方法可用于调用函数，两个方法的第一个参数必须是对象本身，两个方法都使用了对象本身作为第一个参数。
两者的区别在于第二个参数： apply传入的是一个参数数组，也就是将多个参数组合成为一个数组传入，而call则作为call的参数传入（从第二个参数开始）。
JavaScript 闭包
在web页面中全局变量属于 window 对象。
全局变量可应用于页面上的所有脚本。
变量声明时如果不使用 var 关键字，那么它就是一个全局变量，即便它在函数内定义。
JavaScript 内嵌函数
所有函数都能访问全局变量。
实际上，在 JavaScript 中，所有函数都能访问它们上一层的作用域。
JavaScript 支持嵌套函数。嵌套函数可以访问上一层的函数变量。
JavaScript 闭包
闭包是一种保护私有变量的机制，在函数执行时形成私有的作用域，保护里面的私有变量不受外界干扰。
直观的说就是形成一个不销毁的栈环境。
查找 HTML 元素
通过 id 找到 HTML 元素
通过标签名找到 HTML 元素
通过类名找到 HTML 元素
改变 HTML 输出流
avaScript 能够创建动态的 HTML 内容。
绝对不要在文档 (DOM) 加载完成之后使用 document.write()。这会覆盖该文档。
改变 HTML 内容
修改 HTML 内容的最简单的方法是使用 innerHTML 属性。
改变 HTML 属性。
document.getElementById(id).attribute=新属性值
改变 HTML 样式
document.getElementById(id).style.property=新样式
对事件做出反应
用户点击鼠标时
当网页已加载时
当图像已加载时
当鼠标移动到元素上时
当输入字段被改变时
当提交 HTML 表单时
当用户触发按键时
HTML 事件属性
使用 HTML DOM 来分配事件。
onload 和 onunload 事件
在用户进入或离开页面时被触发。
onload 事件可用于检测访问者的浏览器类型和浏览器版本，并基于这些信息来加载网页的正确版本。
onload 和 onunload 事件可用于处理 cookie。
onchange 事件
onchange 事件常结合对输入字段的验证来使用。
onmouseover 和 onmouseout 事件
用于在用户的鼠标移至 HTML 元素上方或移出元素时触发函数。
onmousedown、onmouseup 以及 onclick 事件
当点击鼠标按钮时，会触发 onmousedown 事件。
当释放鼠标按钮时，会触发 onmouseup 事件。
当完成鼠标点击时，会触发 onclick 事件。
addEventListener() 方法
用于向指定元素添加事件句柄。
addEventListener() 方法添加的事件句柄不会覆盖已存在的事件句柄。
可以向一个元素添加多个事件句柄。
可以向同个元素添加多个同类型的事件句柄
可以向任何 DOM 对象添加事件监听，不仅仅是 HTML 元素。
addEventListener() 方法可以更简单的控制事件（冒泡与捕获）。
可以使用 removeEventListener() 方法来移除事件的监听。
语法
element.addEventListener(event, function, useCapture);
第一个参数是事件的类型 (如 "click" 或 "mousedown").
第二个参数是事件触发后调用的函数。
第三个参数是个布尔值用于描述事件是冒泡还是捕获。该参数是可选的。
向原元素添加事件句柄
向同一个元素中添加多个事件句柄。
向 Window 对象添加事件句柄。
传递参数
当传递参数值时，使用"匿名函数"调用带参数的函数。
事件冒泡或事件捕获
事件传递有两种方式：冒泡与捕获。
事件传递定义了元素事件触发的顺序。
在 冒泡 中，内部元素的事件会先被触发，然后再触发外部元素。
在 捕获 中，外部元素的事件会先被触发，然后才会触发内部元素的事件。
addEventListener() 方法可以指定 "useCapture" 参数来设置传递类型
认值为 false, 即冒泡传递，当值为 true 时, 事件使用捕获传递。
removeEventListener() 方法
removeEventListener() 方法移除由 addEventListener() 方法添加的事件句柄。
创建新的 HTML 元素(节点) appendChild()
要创建新的 HTML 元素(节点)需要先创建一个元素，然后在已存在的元素中添加它。
创建 <p> 元素:document.createElement("p");
添加文本节点：document.createTextNode("添加文本节点");
文本节点添加到 <p> 元素中：para.appendChild(node);
创建新的 HTML 元素(节点) insertBefore()
appendChild() 方法，它用于添加新元素到尾部。
insertBefore() 方法，它用于添加将新元素到开始位置。
移除已存在的元素
要移除一个元素，你需要知道该元素的父元素。
removeChild(child); //从父元素中移除子节点
parentNode.removeChild(child);
替换 HTML 元素 replaceChild()
HTMLCollection 对象
getElementsByTagName() 方法返回 HTMLCollection 对象。
HTMLCollection 对象类似包含 HTML 元素的一个数组。
集合中的元素可以通过索引(以 0 为起始位置)来访问。
HTMLCollection 对象 length 属性
注意
HTMLCollection 不是一个数组。
HTMLCollection 看起来可能是一个数组，但其实不是。
可以像数组一样，使用索引来获取元素。
HTMLCollection 无法使用数组的方法： valueOf(), pop(), push(), 或 join() 。
NodeList 对象是一个从文档中获取的节点列表 (集合) 。
NodeList 对象类似 HTMLCollection 对象。
document.querySelectorAll("p"); //选取了文档中所有的 <p> 节点
NodeList 中的元素可以通过索引(以 0 为起始位置)来访问。
NodeList 对象 length 属性
NodeList 对象 length 属性定义了节点列表中元素的数量。
length 属性常用于遍历节点列表。
HTMLCollection 与 NodeList 的区别
HTMLCollection 是 HTML 元素的集合。
NodeList 是一个文档节点的集合。
NodeList 与 HTMLCollection 有很多类似的地方。
NodeList 与 HTMLCollection 都与数组对象有点类似，可以使用索引 (0, 1, 2, 3, 4, ...) 来获取元素。
NodeList 与 HTMLCollection 都有 length 属性。
HTMLCollection 元素可以通过 name，id 或索引来获取。
NodeList 只能通过索引来获取。
只有 NodeList 对象有包含属性节点和文本节点。
节点列表不是一个数组！
节点列表看起来可能是一个数组，但其实不是。
可以像数组一样，使用索引来获取元素。
节点列表无法使用数组的方法： valueOf(), pop(), push(), 或 join()。
扫一扫
1248
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
