jQuery——选择器效率

Posted 2020-07-06 GeoChen

N1：$(‘#box‘).find(‘p‘)：最快，直接了当的找到对应的节点对象；

N2：$(‘p‘,‘#box‘)：注意不是$(‘p,#box‘)!!!，jQuery会按照从右往左的顺序解译执行，所以会选到id=‘box’内的所有p元素；

N3：$(‘#box‘).children(‘p‘);

N4：$(‘#box>p‘)：这种情况会用Sizzle引擎从右往左依次处理，其中符号的识别处理过程无形中增加了处理时间；注：主要的匹配过程的核心是用正则表达式进行的

N5：$(‘#box p’)；

 

一般在使用jQuery的时候尽量使用jQuery提供的函数（find()、prev()、children()、等）而不是某些符号（如：~，+，>，等），同时减少连用的次数（如：$(‘#box‘).find(‘p‘).css({‘color‘:‘red‘,‘font-wight‘:‘bold‘})）;

还有一种更快的方法-------使用中间变量存jQuery对象：

var box=$(‘box‘);

var p=box.find(‘p‘);

p.css(‘color‘,‘red‘);