javascript中拼接HTML字符串的最快、最好的方法
更新时间：2014年06月07日 09:44:24 作者：
这篇文章主要介绍了javascript中拼接HTML字符串的最快、最好的方法，本文共计介绍了3种方法,并对3个各自做了浏览器速度测试,需要的朋友可以参考下
第一种：逐个字符串相加
复制代码 代码如下:
var arr = ['item 1', 'item 2', 'item 3', ...];
list = '';
for (var i = 0,
l = arr.length; i < l; i++) {
list += '' + arr[i] + '';
}
list = '' + list + '';
这种最常见的，但是效率最低！代码逻辑相对来说复杂。
第二种：逐个 push 进数组
复制代码 代码如下:
var arr = ['item 1', 'item 2', 'item 3', ...],
list = [];
for (var i = 0,
l = arr.length; i < l; i++) {
list[list.length] = '' + arr[i] + '';
}
list = '' + list.join('') + '';
比上一种方法稍微快一些，但还是不够好…
第三种：直接join()
复制代码 代码如下:
var arr = ['item 1', 'item 2', 'item 3', ...];
var list = '' + arr.join('') + '';
使用原生的方法（比如 join()），不管它后面是怎么实现的，一般都比其他方法快很多，而且代码非常简洁。
浏览器性能测试
每种方法是使用一个长度为 130 的数组来测试，其中每个元素的长度是多种多样的，防止浏览器对一定长度的字符串做特殊的优化；每种方法测试了 1000 次；下面的结果显示，执行完这 1000 次需要的时间：
相关文章
这篇文章主要介绍了JS设置自定义快捷键并实现图片上下左右移动,文中通过使用自定义热键或者使用键盘上下左右键移动图片，以此来实现此功能，需要的朋友可以参考下2019-10-10
这篇文章主要为大家详细介绍了如何分别使用Vue和JavaScript实现全选与反选功能,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下2024-04-04
这篇文章主要介绍了js实现简易的单数字0-9随机抽奖，可以控制抽取随机数开始与停止，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2015-08-08
这篇文章主要介绍了JS 连接MQTT的使用方法,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2023-01-01
这篇文章主要介绍了js实现简单选项卡与自动切换效果的方法,涉及javascript操作选项卡与自动切换效果的实现技巧,非常具有实用价值,需要的朋友可以参考下2015-04-04
这篇文章主要介绍了javascript cookie的简单应用，我们先介绍一下cookie的使用，以及我后面简单封装一个cookie操作的单例，便于实现cookie的设置，获取，删除的方法，感兴趣的小伙伴们可以参考一下2016-02-02
这篇文章主要介绍了微信小程序通过websocket实时语音识别，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-08-08
在DIV和CSS进行网页布局中，DIV的自适应高度和自适应宽度是一个很常见的问题，本文将介绍左右自适应高度一致的Jquery与DIV高度自适应屏幕的js2013-03-03
这篇文章主要介绍了js实现简单随机抽奖的方法,涉及字符串的操作、setInterval定时调用等技巧,需要的朋友可以参考下2015-01-01
这篇文章主要介绍了微信小程序canvas开发水果老虎机的思路，本文通过思路代码分步骤给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下2020-02-02
最新评论