循环append方法

我想循环往div中添加dom

<div class="svg-container"></div>
<div class="svg-container"></div>
<div class="svg-container"></div>

JS代码:

$(".svg-container").each(function() {
    $(this).append(doc);
}

但是只有最后一个div添加了,我试着用for循环写了也是一样。是什么原因呢?~求大神解答谢谢~


感谢各位的回答,其实我的doc的值是随机的
问题应该是这个,clone的方法应该要当doc是相同的元素才可以

$(".svg-container").each(function() {
    doc=Math.random();//打个比方,其实这里的doc是svg文件
    $(this).append(doc);
}

提问的时候太想当然了以为这里的随机应该和添加没关系,抱歉抱歉~


。。。底下的回答是可以解决的。。。是我写错了 我的锅!

阅读 8.4k
3 个回答

append添加到元素的时候,已存在的元素是移动而不是复制,你用了遍历,所以第一次是新增,后面都是移动前面新增的,最后当然就出现了只有最后一项有东西。
解决办法:
1、不要遍历,你用的是jQuery的类选择器,可以直接$(".svg-container").append(doc),它会自动复制多份保存append进去
2、遍历的时候手动复制一份,$(this).append(doc.clone())
3、doc改成字符串

同一个 DOM 添加到某个位置的时候,会从前一个位置移除,所以你需要 clone

$(".svg-container").each(function() {
    $(this).append(doc.clone());
}

$(".svg-container") 要历遍

$.each($(".svg-container"), function() {

        $(this).append('doc');
    });
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题