DOM

1. dom对象的innerText和innerHTML有什么区别？
   innerText获取其节点和其子节点内包含的文本内容
   innerHTML获取和修改节点内的所有标签和文本内容

2. ** elem.children和elem.childNodes的区别？**
   elem.childNodes返回所有子节点，这些子节点有可能是元素、文本节点、注释或处理指令。
   elem.children只返回元素节点

3. ** 查询元素有几种常见的方法？ES5的元素选择方法是什么?**
   document.getElementById('test-id')
   document.getElementsByTagName('div1')
   document.getElementsByName('form-name')
   document.getElementsByClassName('myclass')

   es5的元素选择方法：
   document.querySelector('#id1')
   如果有多个节点满足匹配条件，则返回第一个匹配的节点。如果没有发现匹配的节点，则返回null。
   document.querySelectorAll()
   返回匹配指定的CSS选择器的所有节点，返回的是NodeList类型的对象

4. 如何创建一个元素？如何给元素设置属性？如何删除属性

var div = document.createElement('div')
div.setAttribute("id","div1")
div.setAttribute("class","class1")
div.removeAttribute("class")

5. **如何给页面元素添加子元素？如何删除页面元素下的子元素?
   **
   appendChild("div")
   在元素末尾添加子元素
   insertBefore()
   在当前元素的某个子元素之前再插入一个子元素
   replaceChild("newdiv","olddiv ")
   接受两个参数：要插入的元素和要替换的元素
   removeChild('div')
   删除子元素
6. element.classList有哪些方法？如何判断一个元素的 class 列表中是包含某个 class？如何添加一个class？如何删除一个class?
   方法：

• add('value') 增加一个名为value的class
• contain('value') 检查当前元素是否包含名为value的class。若有，返回true；没有，返回false
• remove('value') 删除名为value的class
• toggle('value'，boolValue) 将某个class移入或移出当前元素。toggle方法可以接受一个布尔值，作为第二个参数，如果为true，则添加该属性；如果为false，则去除该属性。

contain()判断一个元素的 class 列表中是包含某个 class
add()添加一个class
remove()删除一个class

7. 如何选中如下代码所有的li元素？ 如何选中btn元素？

<div class="mod-tabs">
   <ul>
       <li>list1<li>
       <li>list2<li>
       <li>list3<li>
   </ul>
   <button class="btn">点我</button>
</div>

var li = document.getElementsByTagName('li')
var li2 = document.querySelectorAll('li')
var btn = document.getElementsByClassName('btn')
var btn2 = document.querySelector('.btn')