题目一、dom 对象的 innerText 和 innerHTML 有什么区别？
- innerText 获取 DOM 对象下的文本节点内容
- innerHTML 获取 DOM 对象下的所有节点
题目二、 elem.children和elem.childNodes的区别？
DOM 对象有多种类型，如下
| 节点类型 | NodeType |
|---|---|
| 元素 element | 1 |
| 属性 attr | 2 |
| 文本 text | 3 |
| 注释 comments | 8 |
| 文档 document | 9 |
如果用elem.children来获取节点的话，那么返回的都是element元素，而用elem.childNodes来获取节点的话，返回的是所有类型的节点。
题目三、查询元素有几种常见的方法？ES5 的元素选择方法是什么?
传统的常用元素获取方法：
- document.getElementById() => 获取对应 id 的元素
- document.getElementsByTagName() => 获取符合对应标签名的所有元素
- document.getElementsByClassName() => 获取类的所有元素
- document.getElementsByName() => 获取元素 name 属性为对应值的所有元素
ES5 的元素选择方法：
- document.querySelector() => 以 CSS 选择器的方法返回匹配的对应元素,返回匹配的第一个
- document.querySelectorAll() => 以 CSS 选择器的方法返回匹配的对应的所有元素
题目四、如何创建一个元素？如何给元素设置属性？如何删除属性
- document.createElement() => 创建一个指定 tag 的新元素
- element.getAttribute() => 获取指定名字属性的值
- element.setAttribute() => 设置指定名字属性的值
- element.removeAttribute() => 删除指定名字属性
题目五、如何给页面元素添加子元素？如何删除页面元素下的子元素?
添加元素
- element.appendChild() => 往对应元素的末尾添加新元素，作为其子元素
- parentElement.insertBefore(new, brother) => 在父元素内，往对应元素的前面添加新元素，作为其兄弟元素
删除元素 - parentElement.removeChild(child) => 在父元素内，移除指定子元素
题目六、element.classList 有哪些方法？如何判断一个元素的 class 列表中是包含某个 class？如何添加一个 class ？如何删除一个 class ?
- add() => 添加一个指定的新 class
- item() => 获取指定索引的 class
- remove() => 移除指定的一个或者多个 class
- contains() => 判断 element 是否有指定的 class
题目七、 如何选中如下代码所有的 li 元素？ 如何选中 btn 元素？
<div class="mod-tabs">
<ul>
<li>list1</li>
<li>list2</li>
<li>list3</li>
</ul>
<button class="btn">点我</button>
</div>
结果
var liArray = document.querySelectorAll('.mod-tabs li')
var btn = documents.querySelector('.mod-tabs .btn')
