修改文档

几乎所有 DOM 数据结构中的元素都可以被修改。文档树的形状可以通过改变父子关系来修改。 节点的remove方法将它们从当前父节点中移除。appendChild方法可以添加子节点，并将其放置在子节点列表末尾，而insertBefore则将第一个参数表示的节点插入到第二个参数表示的节点前面。

<p>One</p>
<p>Two</p>
<p>Three</p>
<script>
  let paragraphs = document.body.getElementsByTagName("p");
  document.body.insertBefore(paragraphs[2], paragraphs[0]);
</script>

每个节点只能存在于文档中的某一个位置。因此，如果将段落Three插入到段落One前，会将该节点从文档末尾移除并插入到文档前面，最后结果为Three/One/Two。所有将节点插入到某处的方法都有这种副作用——会将其从当前位置移除（如果存在的话）。

replaceChild方法用于将一个子节点替换为另一个子节点。该方法接受两个参数，第一个参数是新节点，第二个参数是待替换的节点。待替换的节点必须是该方法调用者的子节点。这里需要注意，replaceChild和insertBefore都将新节点作为第一个参数。