进阶-任务8

题目1： dom对象的innerText和innerHTML有什么区别？

• innerText指元素包含的文本内容
• innerHTML值元素包含的HTML结构

题目2： elem.children和elem.childNodes的区别？

• elem.children
  children属性返回一个动态的HTMLCollection集合，由当前节点的所有Element子节点组成。
• elem.childNodes
  childNodes属性返回一个NodeList集合，成员包括当前节点的所有子节点。注意，除了HTML元素节点，该属性返回的还包括Text节点和Comment节点。

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

• document.getElementById()
• document.getElementsByTagName()
• document.getElementsByClassName()
• document.getElementsByName()
• ES5方法
  document.querySelector()
document.querySelectorAll()

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

• 创建元素
  document.createElement()
• 给元素设置属性
  elem.setAttribute()
• 删除属性
  elem.removeAttribute()

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

• 添加子元素
  elem.appendChild()
• 删除子元素
  elem.removeChild()

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

• element.classList的方法：
  add()：增加一个class。
  remove()：移除一个class。
  contains()：检查当前元素是否包含某个class。
  toggle()：将某个class移入或移出当前元素。
  item()：返回指定索引位置的class。
  toString()：将class的列表转为字符串。
• 判断包含class
  elem.classList.contains()
• 添加class

document.getElementById('foo').className += 'bold';
document.getElementById('foo').classList.add('bold');

• 删除class

document.getElementById('foo').classList.remove('bold');

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

var ul = document.querySelector('ul')
var liList = ul.children
var btn = document.querySelector('.btn')