3. DOM
3.1 什么是DOM
DOM，全称Document Object Model文档对象模型。 JS中通过DOM来对HTML文档进行操作。只要理解了DOM就可以随心所欲的操作WEB页面。 文档 文档表示的就是整个的HTML网页文档 对象 对象表示将网页中的每一个部分都转换为了一个对象。 模型 使用模型来表示对象之间的关系，这样方便我们获取对象。
3.2 节点
常用节点分为四类 文档节点 ：整个 HTML 文档 元素节点 ： HTML 文档中的 HTML 标签 属性节点 ：元素的属性 文本节点 ： HTML 标签中的文本内容
document.getElementById() 根据id属性值获取一个元素节点对象。 元素节点.firstChild; 获取元素节点的第一个子节点，一般为文本节点 元素节点.getAttributeNode("属性名"); 可以通过元素节点来获取指定的属性节点
3.3 获取元素节点
3.3.1 通过document对象调用
getElementById() – 通过 id 属性获取 一个 元素节点对象 getElementsByTagName() – 通过 标签名 获取 一组 元素节点对象 getElementsByName() – 通过 name 属性获取 一组 元素节点对象
3.4 获取元素节点的子节点
通过具体的元素节点调用 getElementsByTagName() – 方法 ，返回当前节点的指定标签名后代节点 childNodes – 属性 ，表示当前节点的所有子节点 firstChild – 属性 ，表示当前节点的第一个子节点 lastChild – 属性 ，表示当前节点的最后一个子节点
3.5 获取父节点和兄弟节点
通过具体的节点调用 parentNode – 属性 ，表示当前节点的父节点 previousSibling – 属性 ，表示当前节点的前一个兄弟节点 nextSibling – 属性 ，表示当前节点的后一个兄弟节点
3.6 元素节点的属性
其他属性
3.7 使用CSS选择器进行查询
3.8 节点的修改
4. 事件
4.1 通过HTML标签的属性设置事件
<button οnclick= "alert('hello');alert('world')"> 按钮 </button>
设定步骤非常简单，并且能够确保事件处理程序会在载入时被设定。 如果在函数的最后return false则会取消元素的默认行为
4.2 通过DOM对象的属性绑定
var btn = document.getElementById('btn'); btn.onclick = function(){ alert("hello"); };
这种写法将HTML代码和JS写在不同的位置，维护 起来更加容易
4.3 设置事件监听器
btn. addEventListener ('click' , function(){alert("hello");});
removeEventListener() 和 detachEvent()移除事件
4.4 事件对象
DOM标准的浏览器会将一个event对象传入到事件的处理程序 当中。无论事件处理程序是什么都会传入一个event对象。 btn.onclick = function(event){ alert(event.type); };
4.5 事件的触发
事件的发生主要是由用户操作引起的。 比如mousemove这个事件就是由于用户移动鼠标引起的，在鼠标指针移动的过程中该事件会持续发生。 当指定事件被触发时，浏览器就会调用对应的函数去响应事件，一般情况下事件没触发一次，函数就会执行一次。 因此设置鼠标移动的事件可能会影响到鼠标的移动速度。 所以设置该类事件时一定要谨慎
4.6 事件的传播 （*）
5. BOM
5.1 什么是BOM
ECMAScript无疑是JavaScript的核心，但是要想在浏 览器中使用JavaScript，那么BOM（浏览器对象模型） 才是真正的核心。 BOM 提供了很多对象，用于访问浏览器的功能，这些 功能与任何网页内容无关。 BOM将浏览器中的各个部分转换成了一个一个的对象，我们通过修改这些对象的属性，调用他们的方法，从而 控制浏览器的各种行为
5.2 window对象
5.3 系统对话框
浏览器通过 alert() 、 confirm() 和 prompt() 方法可以调用系统对话框向用户显示消息。 它们的外观由操作系统及（或）浏览器设置决 定，而不是由 CSS 决定。 显示系统对话框时会导致程序终止，当关闭对 话框程序会恢复执行。
5.4 Location对象