1.dom对象的innerText和innerHTML有什么区别？
- innerText：innerText是一个可写属性，返回元素内包含的文本内容，在多层次的时候会按照元素由浅到深的顺序拼接其内容，也就是说获取到的是不带标签的文本的拼接组合。
- innerHTML：innerHTML属性作用和innerText类似，但不是返回元素的文本内容，而是返回元素的HTML结构，在写入的时候也会自动构建DOM，获取到的是带标签的文本，当然也能获取所有的子标签。
举例：
<p>123<span>456</span></p>
输出结果
2.elem.children和elem.childNodes的区别？
- elem.children：children属性是HTMLCollection的实例，返回的值是有标签的元素节点。
- elem.childNodes：返回元素的直接子元素及文本节点，文本节点包含了空格、换行符等。
举例：
<p>123<span>456</span></p>
输出结果
3.查询元素有几种常见的方法？
- document.getElamentById()
- document.getElementsByName()
- document.getElementsByTagName()
- document.getElementsByClassName()
- document.querySelector()
- document.querySelectorAll()
- document.elementFromPoint()
4.如何创建一个元素？如何给元素设置属性？
- 通过createElement方法用来生成HTML元素节点。再使用createTextNode方法用来生成文本节点，参数为所要生成的文本节点的内容。
- 通过setAttribute()方法来设置元素属性。
<p class="ct">123<span>456</span></p>
<script>
var newP = document.createElement('span');
var newContent = document.createTextNode('hello');
newP.appendChild(newContent);
document.body.appendChild(newP);
var node = document.getElementsByClassName(".ct");
node.setAttribute("font-size","20px");
</script>
5.元素的添加、删除？
- 通过appendChild()在元素的末尾添加元素。
- 通过removeChild()来删除元素。
6.DOM0 事件和DOM2级在事件监听使用方式上有什么区别？
- DOM0：写在html标签里面，一个事件只能绑定一个函数，但书写方便，兼容性好，缺点就是后期维护不方便。
- DOM2级事件定义了addEventListener和removeEventListener两种方法对事件进行监听，可以接受事件类型、事件处理方法及布尔参数三个参数，其中addEventListener方法只能通过removeEventListener取消。该方法可以为一个事件绑定多个函数。
7.attachEvent与addEventListener的区别？
- addEventListener有三个参数，而attachEvent只有两个参数；
- addEventListener第一个参数是事件类型（click，load），而attachEvent第一个参数指明的是事件处理函数名称（onclick，onload）；
- addEventListener的作用域是元素本身，this指的是触发元素，而attachEvent事件处理程序会在全局变量内运行，this是window；
- addEventListener添加会按照添加顺序执行，而attachEvent添加多个事件处理程序时顺序无规律。
8.解释IE事件冒泡和DOM2事件传播机制？
- IE事件冒泡：事件开始时由最具体的元素接收，然后逐级向上传播到较为不具体的元素
- DOM2事件传播机制：DOM2级事件规定的事件流包括三个阶段：事件捕获阶段，处于目标阶段，事件冒泡阶段。首先发生的是事件捕获，为截取事件提供机会，然后是实际目标接收事件，最后是冒泡阶段。
9.如何阻止事件冒泡？ 如何阻止默认事件？
- 可以通过stopPropagation()来阻止时间冒泡
- 通过preventDefault()来阻止默认事件
10.有如下代码，要求当点击每一个元素li时控制台展示该元素的文本内容。不考虑兼容
<ul class="ct">
<li>这里是</li>
<li>饥人谷</li>
<li>前端6班</li>
</ul>
<script>
var ct = document.querySelector('.ct');
ct.addEventListener('click',function (e){
console.log(e.target.innerText)
},false);
</script>
输出结果
