DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript綜合知識 >> js原生appendChild的bug解決心得分享
js原生appendChild的bug解決心得分享
編輯:JavaScript綜合知識     

appendChild 主要是用來追加節點 插入到最後

復制代碼 代碼如下:
window.onload = function(){
var ul2 = document.getElementById('ul2');
var oli = document.getElementsByTagName('li');
for(var i=0;i<oli.length;i++){
ul2.appendChild(oli[i]);
}
}
<h3>講Id為ul1的內容插入到ul2裡面</h3>
<ul id="ul1">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
</ul>
<ul id="ul2">
</ul>


把ul1內容插入到ul2裡面,這個其實是搬家而不是復制 這個要切記
可以查看一下效果
為什麼會出現這樣的效果 是因為 循環的時候 由於不停的搬家 導致length 在改變 如果用for的話 這樣開始的length 已經被固定啦 所以出現問題,所以說要改成

復制代碼 代碼如下:
while(oli.length){
ul2.appendChild(oli[0]);
}


這樣的都是插入第一條 所以就成功啦 大家可以試試

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved