DOM操作

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

• innerText返回的是元素内包含的文本内容，多层次时由浅到深拼接内容。
• innerHTML返回的是元素的HTML结构

elem.children和elem.childNodes的区别？

• elem.children返回子元素的集合但是只有元素节点
• elem.childNodes返回子元素的集合，包括元素节点，所有属性和文本，可通过nodeType来判断是哪种类型的节点

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

Query方法(也是ES5的元素选择方法)：

• querySelector()
• querySelectorAll()

Element方法:

• getElementById()
• getElementByName()
• getElementByTagName()
• getElementByClassName()等

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

createElement()//生成元素
setAttribute()//设置元素属性
removeAttribute()//删除元素属性

如何给页面元素添加子元素？如何删除页面元素下的子元素?

给页面添加子元素：
appendChild()//在元素末尾添加子元素
insertBefore()//在某个子元素前插入子元素
删除子元素：
removechild()//删除子元素

element.classList有哪些方法？如何判断一个元素的 class 列表中是包含某个 class？如何添加一个class？如何删除一个class?

classList.add()//新增class
classList.remove()//删除class
classList.toggle()//如果存在则删除并返回false;不存在则添加并返回true，第二个参数为是否强制
classList.contains()//判断是否拥有
classList.item()//返回索引值

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

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

选中li元素
document.querySelectorAll('.mod-tabs ul')
选中btn元素
document.querySelector('.btn')