以下2个jQuery代码片段有什么区别吗？

以下2个jQuery代码段有什么区别吗？两者都提供相同的输出，但没有任何人比其他人有优势，或者他们只是一个人的选择来写这样做的事情。以下2个jQuery代码片段有什么区别吗？

片段1：

div = $("#myDiv"); 
div.append("<ul>"); 
$.each(cobj, function(k,v) { 
    div.append("<li><span class='"+v+"'>"+k+"</span></li>"); 
}); 
div.append("</ul>");

片段2：

$("<ul>").attr("id", "myUL").appendTo("#myDiv"); 
$.each(cobj, function(k, v) { 
    var li = $("<li>"); 
    $("<span>").text(k).attr("class",""+v}).appendTo(li); 
    li.appendTo("#myUL"); 
});

来源

2011-09-27 Harry Joy

对我来说很难理解。为什么你不把所有的字符串（如字符串生成器）合并为一个文本，然后附加到“div”标签？ – vietean

@vietean：与片段1相似（不完全相同）。 –

我不确定，但我认为与您比较将所有字符串合并为一个比append在性能上更好。我认为，如果您尝试使用peer元素，Document（DOM）将尝试解析内容... – vietean

两者都不是好在性能方面处理DOM树的方法。我建议如下：

var ul = $("<ul id='myUL'>"); 
$.each(cobj, function(k,v) { 
    ul.append("<li><span class='"+v+"'>"+k+"</span></li>"); 
}); 
$("#myDiv").append(ul);

这样，每个李追加后的浏览器不重新渲染页面，整个列表是建立离线，然后用单呼追加。

来源

2011-09-27 09:08:41

它与摘录1相似。 –

@HarryJoy是的，但它不一样。正如我所说的，差别恰恰在于性能（在cobj数组中使用1000个元素进行测试）。 –

在1 UL没有ID，而在2它具有ID = “myUL”

来源

2011-09-27 09:06:15 graphicdivine

不错的选择。但是这实际上并不是我想要的？我想知道它们之间是否有任何性能差异？ –

您没有看到ID是否存在性能问题？ – graphicdivine

以下2个jQuery代码片段有什么区别吗？

回答

相关问题