replaceChild()函数用法介绍

快乐打工仔 分类:实例代码

此函数可以将指定元素的子节点替换为另一个。

如果此函数执行成功,则返回被替换的节点,如果替换失败则返回null。

语法结构:

nodeObject.replaceChild(new_node,old_node)

参数列表:

参数 描述
new_node 必需。指定新的节点。
old_node 必需。指定被替换的节点。

代码实例:

<!DOCTYPE html> 
<html> 
<head> 
<meta charset=" utf-8"> 
<meta name="author" content="http://www.pipipi.net/" />
<head>
<title>replaceChild()函数-犀牛前端部落</title>
<script type="text/javascript">  
window.onload=function(){
  var mytable=document.getElementById("mytable");
  var newTd=document.createElement("td");
  var textNode=document.createTextNode("犀牛前端部落");
  newTd.appendChild(textNode);
  var oldTd=document.getElementById("mytd");
  mytable.getElementsByTagName("tr")[0].replaceChild(newTd,oldTd);
}
</script> 
</head> 
<body>
<table id="mytable" border="1">
  <tr>
    <td id="mytd">原来的内容</td>
  </tr>
</table>
</body> 
</html>

以上代码代码而已将table中的td节点进行替换。

特别说明:nodeObject必须是要替换节点的一级父节点。

replaceChild()函数用法介绍,这样的场景在实际项目中还是用的比较多的,关于replaceChild()函数用法介绍就介绍到这了。

replaceChild()函数用法介绍属于前端实例代码,有关更多实例代码大家可以查看

回复

我来回复
  • 暂无回复内容