Web-API-DOM-删除节点-复制节点-三种动态创建元素区别-DOM 重点核心

5.5 删除节点
node.removeChild(child)
node.removeChild() 方法从 DOM 中删除一个子节点，返回删除的节点。
5.6 复制节点
node.cloneNode()
node.cloneNode() 方法返回调用该方法的节点的一个副本。
注意：

1. 如果括号参数为空或者为 false ，则是浅拷贝，即只克隆复制节点本身，不克隆里面的子节点。
2. 如果括号参数为 true ，则是深度拷贝，会复制节点本身以及里面所有的子节点
   5.8 三种动态创建元素区别
   document.write() 直接将内容写入内容流,但文档流执行完毕,则它会导致页面全部重绘
   element.innerHTML 将内容写入某个DOM节点,不会导致页面全部重绘
   创建多个元素效率更高(不拼接字符串,采取数组形式拼接),结构稍复杂
   document.createElement() 创建多个元素效率稍低,但结构更清晰
   总结：不同浏览器下，innerHTML 效率要比 creatElement 高
3. DOM 重点核心
   关于dom操作，我们主要针对于元素的操作。主要有创建、增、删、改、查、属性操作、事件操作。
   6.1 创建
   1. document.write
   2. innerHTML
   3. createElement
      6.2 增
   4. appendChild
   5. insertBefore
      6.3 删
   6. removeChild
      6.4 改 主要修改dom的元素属性，dom元素的内容、属性, 表单的值等
   7. 修改元素属性： src、href、title等
   8. 修改普通元素内容： innerHTML 、innerText
   9. 修改表单元素： value、type、disabled等
   10. 修改元素样式： style、className
       6.5 查 主要获取查询dom的元素
   11. DOM提供的API 方法： getElementById、getElementsByTagName 古老用法 不太推荐
   12. H5提供的新方法： querySelector、querySelectorAll 提倡
   13. 利用节点操作获取元素： 父(parentNode)、子(children)、兄(previousElementSibling、
       nextElementSibling) 提倡
       6.6 属性操作 主要针对于自定义属性。
   14. setAttribute：设置dom的属性值
   15. getAttribute：得到dom的属性值
   16. removeAttribute移除属性
       6.7 事件操作 给元素注册事件，采取 事件源.事件类型 = 事件处理程序
       鼠标事件 触发条件
       onclick 鼠标点击左键触发
       onmouseover 鼠标经过触发
       onmouseout 鼠标离开触发
       onfocus 获得鼠标焦点触发
       onblur 失去鼠标焦点触发
       onmousemove 鼠标移动触发
       onmouseup 鼠标弹起触发
       onmousedown 鼠标按下触发