Question

以下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");  
});

Answer 1

两者都不是在性能方面对DOM树进行操作的好方法。我建议如下：

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

通过这种方式，浏览器不会在追加每个li之后重新呈现页面，整个列表都是脱机构建的，然后附加单个调用。

Answer 2

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

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

2 个答案: