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]);
}
这样的都是插入第一条 所以就成功啦 大家可以试试
复制代码 代码如下:
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]);
}
这样的都是插入第一条 所以就成功啦 大家可以试试
标签:
原生js,appendChild
免责声明:本站文章均来自网站采集或用户投稿,网站不提供任何软件下载或自行开发的软件!
如有用户或公司发现本站内容信息存在侵权行为,请邮件告知! 858582#qq.com
暂无“js原生appendChild的bug解决心得分享”评论...
更新动态
2024年11月13日
2024年11月13日
- 许巍《试音天碟》人声测试天碟[WAV分轨][1G]
- 蔡琴《你不要那样看着我的眼睛》SACD版[低速原抓WAV+CUE][1G]
- 费玉清《一剪梅》24K金碟德国版[低速原抓WAV+CUE][1G]
- 宝可梦大集结国服什么时候上线 大集结国服上线时间一览
- 宝可梦大集结国服官网地址是什么 大集结官方网址一览
- 宝可梦大集结开服5选1礼包怎么选 新手5选1宝可梦推荐
- 劳斯莱斯女车主丈夫坦言拒赔原因:确实有流量因素
- 《心灵杀手2》PS5 Pro实机演示:质量模式4K 30帧
- 玩家分享买二手盘暖心经历:盘上还有小贴纸表达感谢
- 殷秀梅.2014-沁园春·雪【太平洋影音】【WAV+CUE】
- 范玮琪.2003-真善美【福茂】【WAV+CUE】
- 陈雷.1995-烧翻卖【金圆唱片】【WAV+CUE】
- 乱石堆中一粒砂金——《使命召唤21》评测
- 【果娘聊天室】双11即将结束,各位今年买了啥?
- 双十一必入爆款:微星MPGZ890 EDGE TI刀锋钛主板评测