dom

**题目1： dom对象的innerText和innerHTML有什么区别？**innerText:向节点中插入文本内容，html内容不会被解析innerHtml：向节点中插入html，内容以html的方式被解析如图

**题目2： elem.children和elem.childNodes的区别？**，childNodes 属性，标准的，它返回指定元素的子元素集合，包括HTML节点，所有属性，文本,空白部分。children 属性，非标准的，它返回指定元素的子元素集合。返回HTML节点，甚至不返回文本节点。如图

**题目3：查询元素有几种常见的方法？ES5的元素选择方法是什么?****getElementById()**getElementById方法返回匹配指定ID属性的元素节点。如果没有发现匹配的节点，则返回null。这也是获取一个元素最快的方法**getElementsByClassName()**getElementsByClassName方法返回一个类似数组的对象（HTMLCollection类型的对象），包括了所有class名字符合指定条件的元素（搜索范围包括本身），元素的变化实时反映在返回结果中。这个方法不仅可以在document对象上调用，也可以在任何元素节点上调用。**getElementsByTagName()**getElementsByTagName方法返回所有指定标签的元素（搜索范围包括本身）。返回值是一个HTMLCollection对象，也就是说，搜索结果是一个动态集合，任何元素的变化都会实时反映在返回的集合中。这个方法不仅可以在document对象上调用，也可以在任何元素节点上调用。**getElementsByName()**getElementsByName方法用于选择拥有name属性的HTML元素，比如form、img、frame、embed和object，返回一个NodeList格式的对象，不会实时反映元素的变化。**querySelector()**querySelectorAll方法返回匹配指定的CSS选择器的所有节点，返回的是NodeList类型的对象。NodeList对象不是动态集合，所以元素节点的变化无法实时反映在返回结果中。**querySelectorAll()**querySelectorAll方法返回匹配指定的CSS选择器的所有节点，返回的是NodeList类型的对象。NodeList对象不是动态集合，所以元素节点的变化无法实时反映在返回结果中querySelector方法返回匹配指定的CSS选择器的元素节点。如果有多个节点满足匹配条件，则返回第一个匹配的节点。如果没有发现匹配的节点，则返回null。ESE5新增的方法querySelectorAll() querySelector()**题目4：如何创建一个元素？如何给元素设置属性？如何删除属性****创建一个元素**createElement()**给元素设置属性值**setAttribute()**删除属性**romoveAttribute()

**题目5：如何给页面元素添加子元素？如何删除页面元素下的子元素?**appendChild()在元素末尾添加元素删除元素使用removeChild()方法即可parentNode.removeChild(childNode);

**题目6： element.classList有哪些方法？如何判断一个元素的 class 列表中是包含某个 class？如何添加一个class？如何删除一个class?**方法描述add(class1, class2, ...)在元素中添加一个或多个类名。如果指定的类名已存在，则不会添加contains(class)返回布尔值，判断指定的类名是否存在。可能值：true - 元素包已经包含了该类名false - 元素中不存在该类名item(index)返回类名在元素中的索引值。索引值从 0 开始。如果索引值在区间范围外则返回 nullremove(class1, class2, ...)移除元素中一个或多个类名。**如何判断一个元素的 class 列表中是包含某个 class**element.classList.contains(class)//存在返回true不存在返回false，如图

**如何添加一个class？**element.classList.add(类名)如图

**如何删除一个class？**element.classList.remove(class1, class2, ...)移除元素中一个或多个类名。移除不存在的类名，不会报错。

**题目7： 如何选中如下代码所有的li元素？ 如何选中btn元素？**如何选中如下代码所有的li元素？document.querySelectorAll('.mod-tabs li')document.getElementsByTagName(li) 如何选中btn元素？**document.getElementsByClassName('btn')