javascript - 我应该如何使用 jQuery 将多个相同的元素添加到一个 div

Question

我需要使用 jQuery 将多个空 div 添加到容器元素。

目前我正在使用循环生成一个包含空 html 的字符串

divstr = '<div></div><div></div>...<div></div>';

然后将其注入(inject)到我的容器中:

$('#container').html(divstr);

是否有更优雅的方式来插入多个相同的元素？

我希望找到既不会破坏链接又不会让浏览器崩溃的东西。可链接的 .repeat() 插件？

Answer 1

如果您希望 IE 更快 - 或者通常考虑速度，那么您需要先构建一个 DOM 片段，然后再插入它。

John Resig 解释了这项技术并包括了一个性能基准:

http://ejohn.org/blog/dom-documentfragments/

var i = 10, 
    fragment = document.createDocumentFragment(), 
    div = document.createElement('div');

while (i--) {
    fragment.appendChild(div.cloneNode(true));
}

$('#container').append(fragment);

我意识到在构建片段时并没有大量使用 jQuery，但我已经运行了一些测试并且我似乎无法执行 $(fragment).append() - 但我已经阅读John 的 jQuery 1.3 版本应该包含基于上面链接的研究的更改。