replaceChild()方法将把一个给定父元素里面的一个子节点替换为另一个子节点

你还记得parentNode的方法的示例吗↓

<div id="text">
  <p id="con"> parentNode 获取指点节点的父节点</p>
</div> 
<script type="text/javascript">
  var mynode= document.getElementById("con");
  document.write(mynode.parentNode.nodeName);
</script>

这里找到p元素的父节点mynode.parentNode→div

回到replaceChild方法把一个给定父元素里面的一个子节点替换为另一个子节点

  <div><b id="oldnode">JavaScript</b>是一个很常用的技术，为网页添加动态效果。</div>
  <a href="javascript:replaceMessage()"> 将加粗改为斜体</a>
  
    <script type="text/javascript">
      function replaceMessage(){
        var newnode=document.createElement("i");
        var newnodeText=document.createTextNode("javaScript");
        newnode.appendChild(newnodeText);
        var oldNode=document.getElementById("oldnode");
        oldNode.parentNode.replaceChild(newnode,oldNode);
 
       }    
  </script>

oldNode.parentNode.这里就是找到了id=‘oldnode’的给定父元素div然后用新建的 i 子节点替换原有的 b 子节点

----------不知道我有没有说明白，如果还有不清楚的可以再提出来~

替换元素子节点

元素节点对象.replaceChild(新的子节点, 被替换的子节点);

作用:用参一新的子节点替换掉参二指定的子节点.当 参二被替换时，所有与之相关的属性和内容都将被移除.

返回被替换对象的引用。

replaceChild()方法是替换子节点的方法, oldnode加上parentNode才拥有子节点成为父元素,才能使用这个方法.