节点获取与增删

根据层次获取节点
* 1 .childNodes： 获取元素的所有子节点。包括回车等文本节点。
* .children: 获取当前元素的所有元素节点(只获取标签)。
*
* 2 .firstChild: 获取元素的第一个子节点。包括回车等文本节点。
* .firstElementChild: 获取元素的第一个子节点。不包括回车等文本节点。
* .lastChild: 获取元素的最后一个子节点。包括回车等文本节点。
* .lastElementChild:
*
* 3 .parentNode: 获取当前节点的父节点。
*
* 4 .previousSibling: 获取当前节点的前一个兄弟节点；包括回车等文本节点。
* .previousElementSibling:
*
* 5 .nextSibling: 获取当前节点的后一个兄弟节点；包括回车等文本节点。
* .nextElementSibling:
*
* 6 .getAttributes: 获取当前节点的属性节点。
*

      创建并新增节点     * 1. document.createElement("标签名")：创建节点 。需要配合 setAttribute设置各种新的属性；     * 2. 父节点.appendChild(新节点)：末尾追加方式插入节点     * 3. 父节点.insertBefore(新节点,目标节点)：在目标节点前插入新节点.     * 4. 被克隆节点.cloneNode(true/false)：克隆节点     *    >>> 传入true： 表示克隆当前节点，以及当前节点的所有字节点；     *    >>> 传入false或不传：  表示只克隆当前节点，而不克隆子节点。     *      * 【删除或替换节点】     * 1. 父节点.removeChild(被删节点): 删除父节点中的子节点；     * 2. 父节点.replaceChild(新节点,老节点): 使用新节点，替换掉老节点。