JQuery Tips(4)----一些关于提高JQuery性能的Tips

在选择时最好以ID选择符作为开头我想这个很好理解因为JQuery内部使用document.getElementByID方法进行ID选择这种方法比其他所有对DOM选择的方法更快所以以$(#)开头是最好的,比如:div ida div classb div classc div classd/div /div /div /div script typetext/javascript $(.b .c .d)//slow one $(#a .b .c .d)//fast one /script提供$()的上下文在使用$()选择页面元素时提供选择的范围可以减少选择的时间换句话说让选择器只在页面的一小片范围内筛选而不是整个页面当然会减少筛选时间通过在$()函数内提供第二个参数作为上下文可以实现这一点div idtest div classinnerhi/div /div script typetext/javascript alert($(.inner, document.getElementById(test)).text());//increase the speed by provide context alert($(.inner).text());//traverse all the element so that is slower than above /script当然在jquery定义(或者js函数)事件内,可以通过this来指代上下文:div idtest div classinnerhi/div /div script typetext/javascript $(#test).click(function() { var text $(.inner, this).text(); //this means $(#test) alert(text);//alert hi }); /script当然上面的例子也可以写成下面两种方式div idtest div classinnerhi/div /div script typetext/javascript alert($(#test .inner).text()); //method 1 alert($(#test).find(.inner).text());//method 2 and it was best one /script其中利用find方法是所有方法中效率最高的当然如果你是通过id选择符也就是$(#..)来选择不需要提供上下文参数.这对速度没有影响将经常用的JQuery包装好的元素进行保存如题这点比较重要因为使用$()对页面元素进行选择是需要耗费时间的.而保存为变量进行使用时可以避免这种浪费比如ul lione/li litwo/li lithree/li lifour/li lifive/li /ul script typetext/javascript for (i 0; i $(ul li).length; i) {//very bad,select $(ul li) so many times,waste a lot of time alert($(ul li)[i].innerHTML);//same here,very bad } var $li $(ul li); for (i 0; i $li.length; i) {//good one,only selct $(ul li) once alert($li[i].innerHTML); //same here,good } /script从代码可以看到避免多次重复选择可以提高性能:-)尽量少用选择符JQuery的选择器是面向数组的所以在条件允许的情况下尽量少用选择器比如div idDiv0/div div idDiv1/div div idDiv2/div script typetext/javascript $(#Div0).slideDown(slow); $(#Div1).slideDown(slow); $(#Div2).slideDown(slow);//slow $(Div0,Div1,Div2).slideDown(slow);//fast /script可以看出使用选择器并用逗号将被选择的元素分开并选择多个元素不仅让代码更加简洁并且通过减少创建JQuery的实例所以在性能上也稍胜一筹!在循环次数很多时避免使用$().each,而使用for循环使用$().each方法让在进行循环时会让编程更加轻松少量的循环在使用$().each时对性能的影响可以忽略不计但是当这个数字很大的时候对性能的影响便开始变得可观了.这个数字我查了下资料据说是1000以下可以使用$().each方法而这个数字如果继续增加则应该使用for循环语句。