HTML DOM replaceChild() 方法

HTML DOM Element 对象

replaceChild()方法用给定父节点中的新节点替换子节点。

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

使用removeChild()方法从父节点中删除子节点。

语法:

node.replaceChild(newNode, oldNode)
var newElem = document.querySelector("p");
var div = document.getElementById("demo");
div.replaceChild(newElem, div.firstElementChild);
测试看看‹/›

浏览器兼容性

所有浏览器都完全支持replaceChild()方法:

Method
replaceChild()

参数值

参数描述
newNode您要插入的节点对象
oldNode您要删除的节点对象

技术细节

返回值:一个Node对象,表示替换的节点
DOM版本:DOM级别1

更多实例

创建一个新节点并将其替换为现有节点:

var newElem = document.createElement("h2");
var newContent = document.createTextNode("Hi there and greetings!");
newElem.appendChild(newContent);

var div = document.getElementById("demo");
div.replaceChild(newElem, div.firstElementChild);
测试看看‹/›

相关参考

HTML DOM参考:node .parentNode()方法

HTML DOM参考:node .hasChildNodes()方法

HTML DOM参考:node .appendChild()方法

HTML DOM参考:node .insertBefore()方法

HTML DOM参考:node .removeChild()方法

HTML DOM Element 对象