问答题
1.dom对象的innerText和innerHTML有什么区别？
- innerText:获取到当前节点的文本内容不包括标签
- innerHTML:返回元素的html结构，包括标签
2.elem.children和elem.childNodes的区别？
- elem.children:获取html的子节点,返回一个HTMLCollection集合。
- elem.childNodes:获取所有子节点,返回一个NodeList集合,除了HTML元素节点，该属性返回的还包括Text节点和Comment节点。
3. 查询元素有几种常见的方法？
- getElementById():返回匹配指定ID属性的元素节点.如果没有发现匹配的节点，则返回null.这也是获取一个元素最快的方法;
- getElementsByClassName():返回一个类似数组的对象（HTMLCollection类型的对象），包括了所有class名字符合指定条件的元素（搜索范围包括本身），元素的变化实时反映在返回结果中.这个方法不仅可以在document对象上调用，也可以在任何元素节点上调用;
- getElementsByTagName():返回所有指定标签的元素（搜索范围包括本身）.返回值是一个HTMLCollection对象，也就是说，搜索结果是一个动态集合，任何元素的变化都会实时反映在返回的集合中.这个方法不仅可以在document对象上调用，也可以在任何元素节点上调用;
- getElementsByName():用于选择拥有name属性的HTML元素，比如form、img、frame、embed和object，返回一个NodeList格式的对象，不会实时反映元素的变化;
- querySelector():返回匹配指定的CSS选择器的元素节点.如果有多个节点满足匹配条件，则返回第一个匹配的节点.如果没有发现匹配的节点，则返回null;
- querySelectorAll():返回匹配指定的CSS选择器的所有节点，返回的是NodeList类型的对象.NodeList对象不是动态集合，所以元素节点的变化无法实时反映在返回结果中;
4. 如何创建一个元素？如何给元素设置属性？
用createElement方法用来生成HTML元素节点.
var newDiv = document.createElement(“div”);
用setAttribute()方法设置元素属性.
var node = document.getElementById(“div1”);
node.setAttribute(“my_attrib”, “newVal”);
5. 元素的添加、删除？
1.在元素末尾添加元素:appendChild()
var newDiv = document.createElement(“div”);
var newContent = document.createTextNode(“Hello”);
newDiv.appendChild(newContent);
2.在某个元素之前插入元素:insertBefore()
var newDiv = document.createElement(“div”);
var newContent = document.createTextNode(“Hello”);
newDiv.insertBefore(newContent, newDiv.firstChild);
3.替换元素:replaceChild()
newDiv.replaceChild(newElement, oldElement);
4.删除元素:removeChild()
parentNode.removeChild(childNode);
6. DOM0 事件和DOM2级在事件监听使用方式上有什么区别？
DOM0
DOM0事件就是通过onclick写在HTML标签里的事件
<a href="#" onclick="console.log('clicked');">点我</a>
这种写法的缺点是不利于日后维护，代码只能使用一次，没有复用性。
DOM2
DOM2事件有两种方法一个是addEventListener()和removeEventListener() 它们都返回三个参数分别是事件类型、事件处理方法和布尔值默认为false，false是冒泡阶段处理，如果是ture就是在调用阶段处理。
<input id='btn' type="button" name="name" value="点我啊" />
<script>
var btn = document.querySelector("#btn")
btn.addEventListener("click",function(){
console.log("北京欢迎你")
},false)
</script>
7. attachEvent与addEventListener的区别？
- 适用的浏览器不同：
addEventListener适用于现代浏览器
attachEvent是低版本IE浏览器的私有方法 - 参数和触发阶段不同:
addEventListener有三个参数，最后一个参数可以定义处理程序在捕获/冒泡阶段触发
attachEvent只有两个传递参数，只能在冒泡阶段触发 - 第一个参数的形式不同：
addEventListener的第一个参数是click
而attachEvent的第一个参数是onclick - this不同:
addEventListener中的this是触发事件的元素
attachEvent的this指代的是window - 在同一个事件上绑定多个事件处理程序时的执行顺序不同 addEventListener会按添加顺序并按照第三个参数执行
而 attachEvent 的执行是无序的
8. 解释IE事件冒泡和DOM2事件传播机制？
- IE事件冒泡是事件由第一个被触发的元素接收，然后逐级向上传播.
- DOM2事件传播，事件由最外层元素接收，然后逐层向内传播，这个过程为捕获阶段，当达到目标元素时，处于目标阶段，然后事件由目标元素向最外层开始传递，这个过程称之为冒泡阶段.
9. 如何阻止事件冒泡？ 如何阻止默认事件？
- e.stopPropagation();阻止事件冒泡,ie中则用cancelBubble()
- e.preventDefault();阻止默认事件,ie中需要把returnValue设为 false
