删除并追加节点

我想从div（<div id='foo'>）中删除span以下的元素，并追加新创建的节点，而不是每个节点。删除并追加节点

我正在使用循环遍历div的所有子节点，并且找到的每个节点都使用removeChild删除它并附加一个新创建的节点。

我得到O/P为

<div id='foo'> 
    <SPAN>new text</SPAN> 
</div>

我想要的O/P如下

<div id='foo'> 
    <SPAN>new text</SPAN> 
    <SPAN>new text</SPAN> 
    <SPAN>new text</SPAN> 
</div>

代码问题如下提前

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
    <TITLE> New Document </TITLE> 
    <META NAME="Generator" CONTENT="EditPlus"> 
    <META NAME="Author" CONTENT=""> 
    <META NAME="Keywords" CONTENT=""> 
    <META NAME="Description" CONTENT=""> 
</HEAD> 

<BODY> 
<div id='foo'> 
    <SPAN>welcome to the world of translation.</SPAN> 
    <SPAN>Thank you for using it</SPAN> 
    <SPAN>visit again</SPAN> 
</div> 
<table border="0" cellspacing="5" cellpadding="0" class="lipi-header-logo-menu"> 
     <tr> 
      <td align="left"> 
       <SPAN>Hello</SPAN> 
      </td> 
      <td align="left"> 
       World is not enough 
      </td> 
     </tr> 
</table> 
<div><a href="aa" id="id">this is a test</a></div> 

<script> 
var element = document.getElementById('foo'); 

seg = document.createElement('SPAN'); 
root_1_SPAN_1_text = document.createTextNode('new text'); 
seg.appendChild(root_1_SPAN_1_text); 

if (element.hasChildNodes()) 
{ 
    var children = element.childNodes; 
    for (var i = 0; i < children.length; i++) 
    { 
    if(children[i].nodeName=="#text") 
    { 
     continue; 
    } 
    element.removeChild(children[i]); 
    element.appendChild(seg); 
    }; 
}; 


    </script> 
</BODY> 
</HTML>

谢谢

来源

2009-07-23 user105165

你是再追加每一次，这只是移动它在同一个节点

变化（它不会复制吧）这样的：

element.appendChild(seg);

这个

element.appendChild(seg.cloneNode(true));

来源

2009-07-23 12:30:54 Greg

删除并追加节点

回答

相关问题