21. DOM操作

1. dom对象的innerText和innerHTML有什么区别？

• innerText：返回对应元素内的所有文本内容；
• innerHTML：返回元素内的HTML代码（从对象的起始位置到终止位置的全部内容，包括HTML标签）

          标题

---------------------------------------------
document.body.innerText;
//"标题"
document.body.innerHTML;
/*
"
标题
"
*/

1.png

2. elem.children和elem.childNodes的区别？

• elem.childNodes : 是标准属性，返回指定元素的子元素集合，包括HTML节点，所有属性，文本节点。可以通过nodeType来判断是哪种类型的节点，只有当nodeType==1时才是元素节点，2是属性节点，3是文本节点。
• ele.children : 非标准属性，返回指定元素的子元素集合。

3. 查询元素有几种常见的方法？ES5的元素选择方法是什么?

• Document方法：

  • getElementById()：返回匹配指定ID属性的元素节点，如果没有发现匹配的节点，则返回null。这也是获取一个元素最快的方法。
  • getElementsByClassName()：返回一个类似数组的对象，包括所有class名字符合指定条件的元素，元素的变化实时反应在返回的结果中。这个方法不仅可以在document对象上调用，也可以在任何元素节点上调用。
  • getElementsByTagName()：返回所有指定标签的元素（搜索范围包括元素本身）。返回值是一个HTMLCollection对象，也就是说，搜索结果是一个动态集合，任何元素的变化都会实时反映在返回的集合中。这个方法不仅可以在document对象上调用，也可以在任何元素节点上调用。
  • getElementsByName()：适用于拥有name属性的HTML元素，（比如
    和