1、jQuery对象缓存
如果同一元素被查找多次时,就应该将该jQuery对象缓存起来,不然每次查找都要遍历整个文档。
使用下边的代码做个简单的测试
用Chrome浏览器按F12打开控制台查看结果:(注:console.time在Chrome和Firefox浏览器好用,IE不行)
性能还是差很多的~
2、根据一个数组快速拼一个字符串
假如我们有如下这样的一个数组
var arr=['CBA','WCBA','NBA','WNBA'];
最原始的办法(我就是这么写的,以后改进)
var list = '
- ';for (var i = 0; i < arr.length; i++) { list += '
- ' + arr[i] + ' ';}list += '
用jQuery的$.each来遍历
var list = '
- ';$.each(arr, function (i, n) { list += '
- ' + arr[i] + ' ';});list += '
最后用join的方法
var list = '
- ' + arr.join('
- ') + '
上面三种写法输出的结果都是一样的,但最后一种写法从代码量上还是比较占优势。而且经过测试第二种写法和第三种写法,在数组中的数据非常多的情况下,第三种写法的速度要快50%以上,但数据少的情况下速度没有分区。
3、正整使用on给元素绑定事件
我要给如下代码的表格单元格绑定一个单击事件
单元格 |
一般随手会写成下边的样子
$("td").on("click",function(){ alert("我是单元格");})
如果只有一个td这么写没问题,要是有100个td的话那这么写的性能就非常的差,比较好的写法如下
$('#t').on('click', 'td', function () { alert("我是单元格");});
经测试在有100个td的情况下两者性能相差7倍之多。