其实我一直就听别人说如果要显示隐藏尽量不要用hide()和show(),其实一直也没实际测试过,因为自己想当然的也以为,毕竟hide()和show()jquery底层要经过不少判断。今天不知怎么得对他们的性能一直很在意,于是就简单做了如下测试
下面测试了对10000个相同div节点的显示隐藏,测试方法使用了console.time()和console.timeEnd,测试浏览器为谷歌(其它的还没测试)
先来hide()和show()的测试截图
还好,没想象中那么差
addClass()和removeClass()的测试截图
也没比上面的好多少吗
.css({'display':'none'})和.css({'display':'block'})的测试截图
也不错
toggle()的测试截图
好吧,果断抛弃你
从上面的测试来看hide()和show()相对于其它来看确实性能上会差点,但也没想象中那么差,其实一开始只是测试的对一个节点的显示隐藏,由于差别太小(但其实也可以发现hide()和show()性能会差点),所以多加了些节点来测试的。
所以hide()和show()其实也是可以放心实用的,但总的来说还是使用addClass可能会更好点。本篇博客首发于,欢迎点击查看