替換節點

replaceChild()
把一個給定父元素裏的一個子節點替換爲另外一個子節點
var reference = element.replaceChild(newChild,oldChild);
返回值是一個指向已被替換的那個子節點的引用指針。
如果被插入的子節點還有子節點,則那些子節點也被插入到目標節點中  

 練習:


當單擊”北京”這個節點時,北京這個節點被  ”反恐”替換


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>yuhan20081021</title>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  </head>  
  <body>   
 您喜歡的城市:<br> 
  <ul>
  <li id="bj" value="beijing" >北京</li>
<li id="sh" value="shanghai">上海</li>
<li id="cq" value="chongqing"> 重慶</li>
  </ul>  
 您喜歡的遊戲:<br> 
  <ul>
  <li id="fk" value="fangkong">反恐</li>
<li id="ms" value="moshou">魔獸</li>
<li id="cq" value="chuanqi">傳奇</li>
  </ul>   
  </body>
  <script language="JavaScript">
      //點擊北京節點, 將被反恐節點替換
 document.getElementById("bj").οnclick=function(){
  var bjElement= document.getElementById("bj")
var fkElement= document.getElementById("fk");
//獲取北京節點的父節點
var bjParentElement=bjElement.parentNode;
//替換
var oldElement=bjParentElement.replaceChild(fkElement,bjElement);
alert(oldElement.getAttribute("value"))
 }
  </script>  
</html>



發佈了34 篇原創文章 · 獲贊 0 · 訪問量 3萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章