常见错误:
// 以后我们方法使用就是如下形式,如果是null,就是默认会追加到最后
// 在节点上执行insertBefore方法失败了 需要两个参数 但上 只有一个设置了
// Failed to execute 'insertBefore' on 'Node': 2 arguments required, but only 1 present
// 失败了 去 执行 removeChild 在 节点 这个 节点 将要被 删除 不是 一个 子元素 相对于当前节点
// Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.
// 在节点上执行方法失败了,因为你想删除的元素不是当前节点的直接子元素
// 在节点上执行方法失败了 参数 1 不是一个节点类型
// Failed to execute 'removeChild' on 'Node': parameter 1 is not of type 'Node'
// tbody.removeChild(btns)
节点查找
子节点查找(父找子)
childNodes:获取所有订单子节点,包括文本节点(空格、换行)、注释节点等
children:获取所有的元素节点,返回一个伪数组 遍历得到对应元素
语法 父元素.children
子找父
parentNode:查找父节点即父盒子
语法:子元素.parentNode
找兄弟元素
nextElementSibling 找下一个兄弟节点
previousElementSibling 找上一个兄弟节点
语法:元素.nextElementSibling
元素.previousElementSibling
增加节点
创建节点
document.createElement('要创建的标签名')
一般先创建节点,然后插入节点
节点的插入
插入到父元素的最后后面
父元素.appendChild(要插入的元素)
插入父元素中某个子元素的前面
父容器.insertBefore(需要插入的元素,在哪个元素前面)
// 如果参照位置为null,则放在第一位
克隆节点
元素.cloneNode(布尔值) 克隆一个已有的节点
括号的布尔值默认为false
true 克隆时包含后代节点一起克隆(深拷贝)即可以拷贝文本内容 flase 克隆时不包括后代节点(浅拷贝)只拷贝结构,没有文本内容
节点删除
父元素.removeChild(要删除的元素)
注意:删除元素必须于父元素的子元素,即是父子关系
自己删除元素本身
对象.romove