DOM的操作
一、DOM的操作
1、复制节点
cloneNode(deep)
参数deep是boolean类型，true/false
true：表示深度复制（将节点及其子节点都进行复制） --- 深拷贝
false：表示浅复制（只复制节点而不复制子节点） ---- 浅拷贝
2、删除节点
removeChild(node)
（1）参数node为要删除的节点
（2）前提：被删除的节点必须为空（没有子节点）
3、hasChildNodes()：判断当前节点是否有子节点
返回值为false：表示没有子节点
返回值为true：表示有子节点
4、替换节点：replaceChild(newNode,oldNode)
用newNode节点替换oldNode节点
二、事件处理
1、基本概念：
（1）事件：JavaScript可以侦测到的行为（用户在页面上进行的某种操作）
页面加载（浏览器打开页面）、单击鼠标、鼠标进入某个区域、焦点、键盘
（2）事件处理程序：用户进行了某种操作后，所运行的JavaScript程序段
（3）事件驱动式：当事件发生后才去执行相应的程序
（4）事件流：事件发生时，会在发生事件的元素节点与DOM树根节点之间按照特定的顺序进行传播，这个事件传播的过程就是事件流
（5）在web中对事件流的解决方案：
A、事件捕获：网景公司(Netscape)。事件流传播的顺序应该是从DOM树的根节点到发生事件的元素节点
B、事件冒泡：微软公司(Microsoft)。事件流传播的顺序应该是从发生事件的元素节点到DOM树的根节点
冒泡的前提是：父级也定义了相应的事件，当子元素与父元素有相同的事件时，当子元素被触发时父元素也会被触发冒泡机制
C、w3c的事件流处理：在事件发生阶段采用捕获方式（此时不处理），在事件处理阶段采用冒泡（）
（6）事件捕获的实现：
addEventListener（事件名，事件处理程序，事件处理方式）
参数1：事件名（click、change、load、mousedown......）
参数2：事件处理程序
参数3：事件的处理方式（true--表示采用事件捕获方式，false---采用事件冒泡方式）
2、事件的绑定方式
（1）行内绑定式
<标签名 事件名=“事件处理程序”>
（2）动态绑定式
DOM对象名.事件名 = 事件处理程序
注意：“行内绑定式‘和”动态绑定式“
不同点：
a、“行内绑定式‘中事件名为标签的属性，”动态绑定式“中事件名为DOM对象的属性
b、“行内绑定式‘的事件处理程序中的this代表的是window对象，”动态绑定式“的事件处理程序中的this代表的是触发事件的DOM对象
相同点：
一个DOM对象的同一个事件只能有一个事件处理程序
（3）事件监听式：可以给DOM对象的同一个事件绑定多个事件处理程序
DOM对象.attachEvent(type, callback); //早期IE浏览器
DOM对象.addEventListener(type, callback, [capture]); //标准浏览器
3、删除事件绑定：
DOM对象.addEventListener(type, callback);
三、事件对象：
1、来源：当事件发生时，都会产生一个事件对象（event对象）
2、作用：通过事件对象可以了解事件相关的信息（DOM对象、事件的类型...）
3、获取事件对象：
（1）早期的IE浏览器：window.event
（2）标准浏览器：将一个event对象直接传入到事件处理程序中
4、常用属性：
（1）type：代表当前事件的类型
（2）target：返回发出此事件的元素（事件的目标节点）
（3）currentTarget：返回其事件监听器触发该事件的元素
（4）bubbles：表示事件是否是冒泡事件类型
5、常用函数：
（1）stopPropagation()：阻止冒泡事件
（2）preventDefault()：阻止默认行为
四、事件的分类
鼠标事件：click
mouseover：鼠标进入
mouseout：鼠标离开
