jquery中的append的效率问题应用

最新推荐文章于 2021-01-25 20:52:25 发布

最新推荐文章于 2021-01-25 20:52:25 发布 · 1.2k 阅读

文章标签：

#append #jquery #ViewUI

ajax/web相关专栏收录该内容

409 篇文章

订阅专栏

本文介绍了一种提高jQuery中append方法效率的技术。通过一次性构建待追加的内容字符串再进行操作，避免了多次调用append带来的性能开销。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在jquery中的append中，如果一次性要往某个元素append很多东西的话，
比如这样：
var start = new Date().getTime();
for(var cnt=0; cnt < 200; cnt++){
$('.container').append('test
');
}
var timeElapsed = new Date().getTime() - start;
$('#timetaken').html('Time taken: ' + timeElapsed + ' milliseconds');

这样的效率很低，因为重复调用append了，更快的方法是：
var start = new Date().getTime();
var str = '';
for(var cnt=0; cnt < 200; cnt++){
str += 'Lorem ipsum dolor sit amet
';
}
$('.container').append(str);
var timeElapsed = new Date().getTime() - start;
$('#timetaken').html('Time taken: ' + timeElapsed+ ' milliseconds');

就是说，先一次性循环把要增加的字符串整理后，最后再一次append