我有一个字符串big_html,我想将它添加到一些div.我观察到以下性能差异：
$('#some-div').append( big_html );
// takes about 100 ms
//create it first
var append_objs = $(big_html);
$('#some-div').append( append_objs );
//takes about 150 ms
有谁知道为什么会这样？感谢您的时间.
var added = $(big_html).appendTo( '#some-div' ); //150 ms
有没有一种有效的方法来做到这一点？
解决方法
在第二种情况下,jQuery让浏览器构建一个文档片段然后将HTML填入其中以供浏览器解析.然后,当您将其附加到页面时,您可以再次操作DOM.
因此,第二个版本只是做比第一个更多的工作.
我鼓励你(和所有感兴趣的人)保持jQuery的非缩小版本以供阅读.阅读代码是很有启发性的.
在将内容添加到DOM排序后“获取”内容取决于它的内容.由于内容被追加,你必须首先记住目标的最后一个元素：
var last = $('#some_div > *:last');
$('#some_div').append(big_html_string);
var newStuff = last.nextAll();
如果目标div可能开始为空,您还需要检查它：
var newStuff = last.length ? last.nextAll() : $('#some_div > *');