XML DOM replaceChild() 方法

定义和使用

replaceChild() 方法用新节点替换子节点。

新节点可以是文档中的现有节点，也可以创建一个新节点。

提示：替换的子节点可以稍后插入同一文档中的任何元素中；使用 insertBefore() 或 appendChild() 方法稍后将其插入同一文档中，或者使用 acceptNode() 或 importNode() 方法将替换后的节点插入另一个文档中。

浏览器支持

Internet Explorer	Chrome	FireFox	Safari	Opera

9.0（包含）以上支持	4.0（包含）以上支持	2.0（包含）以上支持	3.0（包含）以上支持	9.0（包含）以上支持

所有主流的浏览器均支持 replaceChild() 方法。

语法

nodeObject.replaceChild(newchild,oldchild)

参数

参数	类型	描述
newchild	Object	必填，要放入子列表的新节点
oldchild	Object	必填，子列表中将要替换的节点

返回值

Node object	替换的节点(oldchild)
DOM 版本	核心级别1节点对象。在DOM级别3中修改

示例

以下代码片段将 "books.xml" 加载到 xmlDoc 中，并删除第一个<book>节点中的第一个子节点：

<!DOCTYPE html>
<html>
  <body>
  
  <p id="demo"></p>

  <script>
    var xhttp = new XMLHttpRequest();
    xhttp.onreadystatechange = function() {
        if (xhttp.readyState == 4 && xhttp.status == 200) {
            myFunction(xhttp);
        }
    };
    xhttp.open("GET", "books.xml", true);
    xhttp.send();
    
    function myFunction(xml) {
        var x, y, z, i, newNode, newTitle, newText, xmlDoc, txt;
        xmlDoc = xml.responseXML;
        txt = "";
        x = xmlDoc.documentElement;
        
        // 创建一个book元素，title元素和一个text节点
        newNode = xmlDoc.createElement("book");
        newTitle = xmlDoc.createElement("title");
        newText = xmlDoc.createTextNode("A Notebook");
    
        // 将文本节点添加到标题节点
        newTitle.appendChild(newText);
    
        // 将书名节点添加到书名节点
        newNode.appendChild(newTitle);
    
        y = xmlDoc.getElementsByTagName("book")[0];
    
        // 将第一本书节点替换为新本书节点
        x.replaceChild(newNode, y);
    
        z = xmlDoc.getElementsByTagName("title");
        //输出所有标题  
        for (i = 0; i < z.length; i++) { 
            txt += z[i].childNodes[0].nodeValue + "<br>";
        }
        document.getElementById("demo").innerHTML = txt; 
    }
  </script>
  
  </body>
</html>

尝试一下