1. ParentNode

1.1 概述

  1. 如果该节点是父节点,则会混入ParentNode接口
  2. 只有元素节点、文档节点和文档片段节点拥有子节点,所有只有这三类节点会拥有ParentNode接口

    1.2 属性

    ParentNode.children

  3. 返回一个HTMLCollection集合,成员是当前元素节点的所有元素子节点

    ParentNode.firstElementChild

  4. 返回当前节点第一个元素子节点

    ParentNode.lastElementChild

    ParentNode.childElementCount

  5. 返回一个整数,表示当前节点的所有元素子节点的数目

    1.3 方法

    Parent.append()

  6. 为当前节点追加一个或多个子节点,位置是最后一个元素子节点的后面

  7. 该方法不仅可以添加元素子节点(参数为元素节点),也可以添加文本子节点(参数为字符串)
  8. 该方法没有返回值

    Parent.prepend()

    2. ChildNode接口

    2.1 概述

  9. 如果一个节点有父节点,那么该节点就拥有了ChildNode接口

    2.2 remove()

  10. remove()方法用于从父节点移除当前节点

    1. el.remove();
  11. before()、after()

    • before()方法用于在当前节点的前面,插入一个或多个同级节点
    • 两者有相同的父节点
    • 该方法不仅可以插入元素节点,也可以插入文本节点