2009-07-23 14 views
0

span 요소를 div (<div id='foo'>)에서 제거하고 각 노드 대신 새로 만든 노드를 추가하려고합니다.노드 제거 및 추가

div의 모든 하위 노드를 순환하기 위해 루프를 사용하고 있으며 발견 된 각 노드에 대해 removeChild으로 제거하고 새로 만든 노드를 추가합니다.

나는 문제에 대한

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

코드를 다음과 같이

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

내가 O/P를 원하는 오/P는 무엇입니까 사전에

<!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> 

감사합니다 다음과 같다

답변

2

element.appendChild(seg); 

element.appendChild(seg.cloneNode(true)); 
에 : RE-부가 동일한 노드에게 단지 이동마다이

변경 (이는 복사하지 않는다)