dom对象的innerText和innerHTML有什么区别？
-
innerText 是一个可写属性，返回元素内包含的文本内容，在多层次的时候会按照元素由浅到深的顺序拼接其内容。设置innerText 属性时，给定的值都会被视为文本内容，即使其中包含 HTML 标签
-
innerHTML 返回元素的 HTML 结构，在写入时会自动构建 DOM
elem.children和elem.childNodes的区别？
-
children 为只读属性，返回一个节点的子元素（元素子节点），是一个动态更新的 HTMLCollection
-
childNodes 返回包含指定节点的子节点的集合，包括文本子节点，该集合为即时更新的集合（live collection）
查询元素有几种常见的方法？ES5的元素选择方法是什么?
document.getElementById()
document.getElementsByClassName()
document.getElementsByTagName()
document.getElementsByName()
// 以下为 ES5 新增的方法
document.querySelector() // => 只能获取第一个
document.querySelectorAll()
如何创建一个元素？如何给元素设置属性？如何删除属性？
// 创建元素
var script = document.createElement('script')
// 设置属性
script.setAttribute('src', 'xxx')
// 删除属性
script.removeAttribute('src')
如何给页面元素添加子元素？如何删除页面元素下的子元素?
// 如上，虽然创建了新的 script 元素，却没有添加到文档中
var body = document.getElementsByTagName('body')[0]
body.appendChild(script)
// 删除子元素
body.removeChild(script)
element.classList有哪些方法？如何判断一个元素的 class 列表中是包含某个 class？如何添加一个class？如何删除一个class?
element.classList.add() // 新增 class
element.classList.remove() // 删除 class
element.classList.toggle() // 新增/删除切换
element.classList.contains() // 判断是否拥有 class，返回值为boolean
如何选中如下代码所有的li元素？ 如何选中btn元素？
<div class="mod-tabs">
<ul>
<li>list1</li>
<li>list2</li>
<li>list3</li>
</ul>
<button class="btn">点我</button>
</div>
// 选取 li 元素
// 1
var li_1 = document.getElementsByTagName('li')
// 2
var li_2 = document.getElementsByTagName('ul').childNodes
// 3
var li_3 = document.querySelectorAll('li')
// 选中 btn 元素
// 1
var btn_1 = document.getElementsByClassName('btn')[0]
// 2
var btn_2 = document.getElementsByTagName('button')
// 3
var btn_3 = document.querySelector('.btn')
// 4
var btn_4 = document.querySelector('button')
