1： dom对象的innerText和innerHTML有什么区别？
- innerText 属性可以过滤掉标签，直接获取文本元素，在多层次的时候会按照元素由浅到深的顺序拼接其内容。
- innerHTML 属性和 innerText 类似，但是不是返回元素的文本内容，而是返回元素的HTML结构，在写入的时候也会自动构建DOM。
2： elem.children和elem.childNodes的区别？
- elem.children : 返回指定元素的子元素节点集合，只返回HTML节点，甚至不返回文本节点。
- elem.childNodes : 返回指定元素的所有子节点集合，包括 元素节点，属性节点，文本节点，注释节点等。
参考博客: JavaScript中Element与Node的区别，children与childNodes的区别
3：查询元素有几种常见的方法？ES5的元素选择方法是什么?
常见的有：
- getElementById() 返回匹配指定ID属性的元素节点
-getElementsByClassName() 返回class名字符合指定条件的元素
-getElementsByTageName() 返回所有指定标签的元素
( excluding the element itself 搜索范围不包括本身)
-getElementsByName() 返回所有拥有name属性的HTML元素，比如form、img、frame、embed和object
ES5的元素选择方法有：
- querySelector() 返回匹配指定的CSS选择器的元素节点，需要注意两点：
- 如果有多个节点满足匹配条件，则返回第一个匹配的节点
- querySelector方法无法选中CSS伪元素
- querySelectorAll() 返回匹配指定的CSS选择器的所有节点
4：如何创建一个元素？如何给元素设置属性？如何删除属性
如何创建元素
- createElement() 用来生成HTML元素节点，参数为元素的标签名。
- createTextNode() 用来生成文本节点，参数为所要生成的文本节点的内容。
- createDocumentFragment() 生成一个DocumentFragment对象，其存在于内存的DOM片段，但是不属于当前文档，常常用来生成较复杂的DOM结构，然后插入当前文档。
如何给元素设置属性
有两种方法:
- 一种是使用 creatAttribute() 方法生成一个新的属性对象，然后赋值，然后设置给相应的节点。
var node = document.getElementById("div1");
var a = document.createAttribute("my_attrib");
a.value = "newVal";
node.setAttributeNode(a);
- 直接使用 setAttribute()方法 ，传入两个参数，第一个是属性名，第二个是属性值，推荐这种方法
var node = document.getElementById("div1");
node.setAttribute("my_attrib", "newVal");
如何删除属性
使用removeAttribute()， 用于删除元素属性。
node.removeAttribute('id');
5：如何给页面元素添加子元素？如何删除页面元素下的子元素?
如何给页面元素添加子元素
- appendChild() 在元素末尾添加元素，如下所示：给 ct 下面添加子元素 img
var ct = document.querySelector('#ct')
var node = document.createElement('img')
ct.appendChild(node)
- insertBefore() 在某个元素之前插入元素，如下所示：在ct内的最后一个子元素之前插入img子元素
var ct = document.querySelector('#ct')
var node = document.createElement('img')
ct.insertBefore(node, ct.lastChild)
如何删除页面元素下的子元素
removeChild() 方法可从子节点列表中删除某个节点。
如删除成功，此方法可返回被删除的节点，如失败，则返回 NULL。
如下所示：删除 ct 下的 div 子元素节点，注意这里只能删除单个节点，是 node，不是 nodes。
var ct = document.querySelector('#ct')
var node = document.querySelector('#ct div')
ct.removeChild(node)
6： element.classList有哪些方法？如何判断一个元素的 class 列表中是包含某个 class？如何添加一个class？如何删除一个class?
参数为class类名字符串
- element.classList.add() //新增 class，如果已经存在，则忽略, 可添加多个类 add('class1', 'class2')
- element.classList.remove() //删除 class，可删除多个类 remove('class1', 'class2')
- element.classList.toggle()
新增/删除切换，只有一个参数时，类存在，则删除它并返回false，如果不存在，则添加它并返回true。当存在第二个参数时：如果第二个参数的计算结果为true，则添加指定的类值，如果计算结果为false，则删除它。 - element.classList.contains() // 判断是否拥有某个 class，返回布尔值
element.classList.item ( Number ) 参数为索引值
按集合中的索引返回类值。
7： 如何选中如下代码所有的li元素？ 如何选中btn元素？
<div class="mod-tabs">
<ul>
<li>list1</li>
<li>list2</li>
<li>list3</li>
</ul>
<button class="btn">点我</button>
</div>
<scirpt>
var li = document.querySelectorAll('.mod-tabs ul li')
// document.getElementsByTagName('li')
var btn = document.querySelector('.btn')
// document.getElementsByClassName('btn')[0]
</scirpt>
