jQuery性能优化与技巧
1、使用最新版本的jQuery类库
jQuery的每一个新的版本都会较上一版进行Bug修复和一些优化,同时也会包含一些创新,所以建议使用最新版本的jQuery来提高性能,需要注意的是在更换版本之后,要测试代码,毕竟有的时候不是完全向后兼容的。
2、选择合适的选择器
1)$("#id") id选择器 和 $("p") 标签选择器 是最佳提高性能的方式
使用id选择器来定位DOM是最佳提高性能的方式,如果这个方式不能直接找到需要的元素,可以考虑调用find方法,比如
$("#id").find("div");
2) $("".class) class选择器 是较慢的选择器
比较新的浏览器,例如ie9 它支持本地方法document.getElemntsByTagClassName(),而对于老的浏览器,例如 ie8或者更早版本只能靠使用DOM方式来实现,对性能产生的影响比较大
3) $("[attribute = value]") 属性选择器 和 $(":hidden") 伪类选择器 最慢的选择器
因为这种选择器没有直接在本地JavaScript方法中实现,是使用DOM来实现的,如果必须使用这种方式,可以先使用id选择器来定位父元素,然后再使用该选择器
3、缓存对象
例如 $("#monitor_table").css("width", "60%");
$("#monitor_table").css("color", "red");
$("#monitor_table").click(function(){....})
4、当有DOM操作时,将所有元素封装成一个元素