jquery选择器的实现流程简析
当我们洋洋得意的使用jquery强大的选择器功能时有没有在意过jquery的选择性能问题呢,其实要想高效的使用jquery选择器,了解其实现流程是很有必要的,那么这篇文章我就简单的讲讲其实现流程,相信会为读者的jquery优化开发提供一些小的建议。
我们知道jquery的$()函数可以传很多种参数(document、string、fn、array、number),那么jquery的init方法就会根据你传参的类型的不同进入不同的流程。其他的我们今天就不多说了,我们重点讲一下对string类型的处理,因为只有它才会触发jquery的选择器功能。
1、首先是使用正则表达式检查是不是创建dom的操作,例如$(“<div></div>”),就是要创建div了;
2、否则就是选择操作,然后会判断是不是简单的id选择,当然这一步也是正则匹配,jquery在这里会毫不犹豫的调用document.getElementById,无疑,这是最快的选择了;
3、最后就是直接进入jQuery.fn.find()方法,这里就是jquery所引用的sizzle选择器放大光芒的地方了。
从上面我们可以看出来,jquery选择器只是对简单的id选择开了小灶,其他的css选择很大一部分需要借助于sizzle,所以说,这里总结一点,简单的id选择是jquery中最快的了。
有的人就说了,我不可能都用id选择器呀,别急,咱们再看看sizzle强大的选择功能吧。Sizzle是jquery从1.3版本开始引入的选择引擎。我们一般实现的选择的选择器模式(也包括jquery 1.2)都是Left To Right模式,而sizzle却别出新格,使用了Right To Left(以下我们简称RTL),说的是不是有点迷了,别急咱们结合例子给大家说明一下:
例 1:$(“div a”)
一般的选择流程(LTR):
、选择页面中所有的div
‚、选择div下的所有a标签
ƒ、合并结果集,返回结果集
Sizzle的选择流程(RTL):
、选择页面中所有的a标签
‚、判断a标签的父节点是否为div标签,是则push,否则shift
ƒ、返回结果集
有没有发现,RTL的选择模式其实是少了一个合并操作,不要小看这一步,其实节省了很多时间,这就是sizzle能够高效的选择结果集的诀窍之一,其实从sizzle的这一点就给了我们一个高效选择的建议,多使用Right To Left的选择模式。
下面咱们看一下这么一个选择:$('#test span'),相信很多人都是用过类似这种的选择模式,那么其实现流程呢?Jquery是通过$().find()方法启用sizzle的,上面写的这种模式会有一个函数判断启用find,然后才调用sizzle,那么咱们再看一看另外一种相同的选择:$(“#test”).find(“span”),这种方法则会跳过find函数判断,直接启用sizzle,这一点改变,执行效率能够提升8倍多,而且选择结果相同,大家可以使用firebug测试一下哟(使用console.profile("性能1")),这就给了我们另一个建议,多使用find方法代替css层级选择。
咱们再看一个选择方法:$('span:eq(0)'),通过firebug可以看到,这个选择方法调用了34次函数,而结果相同的 $('span').first()却只调用了14次,执行时间前者是后者的将近20倍,过滤函数的优化效应可见一斑呀。Sizzle在这里有一个判断,如果存在位置信息(例如 eq,first等)就会执行LTR选择模式,递归调用sizzle,大大降低执行效率,所以这里我建议,多使用过滤选择器,可以有效提高执行速度。
这里就简单的介绍到这里,其实我感觉只要能够做到上面的几点就能很好地提高jquery的选择速度了。
个人整理,欢迎评错。
相关推荐
在jQuery选择器中,层次选择器是非常重要的一类,它包括了用于匹配特定父子或祖先后代关系的元素的选择器。本文将详细解析jQuery层次选择器中的"ancestor descendant"和"parent>child"选择器之间的区别,并通过实例...
`swfPath` 是 Flash 回退 SWF 文件的位置,`supplied` 指定 Jplayer 支持的媒体格式,`wmode` 设置 Flash 的窗口模式,`cssSelectorAncestor` 用于指定 Jplayer 组件的 CSS 选择器前缀。 Jplayer 还提供了丰富的 ...
在网页设计中,`<select>`元素用于创建下拉菜单,但它的样式受到浏览器的限制,难以实现自定义设计。为了突破这些限制,开发者经常使用`div`和`css`来模拟`select`下拉菜单,以实现更丰富的视觉效果和交互体验。这种...
嵌入式八股文面试题库资料知识宝典-华为的面试试题.zip
训练导控系统设计.pdf
嵌入式八股文面试题库资料知识宝典-网络编程.zip
人脸转正GAN模型的高效压缩.pdf
少儿编程scratch项目源代码文件案例素材-几何冲刺 转瞬即逝.zip
少儿编程scratch项目源代码文件案例素材-鸡蛋.zip
嵌入式系统_USB设备枚举与HID通信_CH559单片机USB主机键盘鼠标复合设备控制_基于CH559单片机的USB主机模式设备枚举与键盘鼠标数据收发系统支持复合设备识别与HID
嵌入式八股文面试题库资料知识宝典-linux常见面试题.zip
面向智慧工地的压力机在线数据的预警应用开发.pdf
基于Unity3D的鱼类运动行为可视化研究.pdf
少儿编程scratch项目源代码文件案例素材-霍格沃茨魔法学校.zip
少儿编程scratch项目源代码文件案例素材-金币冲刺.zip
内容概要:本文深入探讨了HarmonyOS编译构建子系统的作用及其技术细节。作为鸿蒙操作系统背后的关键技术之一,编译构建子系统通过GN和Ninja工具实现了高效的源代码到机器代码的转换,确保了系统的稳定性和性能优化。该系统不仅支持多系统版本构建、芯片厂商定制,还具备强大的调试与维护能力。其高效编译速度、灵活性和可扩展性使其在华为设备和其他智能终端中发挥了重要作用。文章还比较了HarmonyOS编译构建子系统与安卓和iOS编译系统的异同,并展望了其未来的发展趋势和技术演进方向。; 适合人群:对操作系统底层技术感兴趣的开发者、工程师和技术爱好者。; 使用场景及目标:①了解HarmonyOS编译构建子系统的基本概念和工作原理;②掌握其在不同设备上的应用和优化策略;③对比HarmonyOS与安卓、iOS编译系统的差异;④探索其未来发展方向和技术演进路径。; 其他说明:本文详细介绍了HarmonyOS编译构建子系统的架构设计、核心功能和实际应用案例,强调了其在万物互联时代的重要性和潜力。阅读时建议重点关注编译构建子系统的独特优势及其对鸿蒙生态系统的深远影响。
嵌入式八股文面试题库资料知识宝典-奇虎360 2015校园招聘C++研发工程师笔试题.zip
嵌入式八股文面试题库资料知识宝典-腾讯2014校园招聘C语言笔试题(附答案).zip
双种群变异策略改进RWCE算法优化换热网络.pdf
内容概要:本文详细介绍了基于瞬时无功功率理论的三电平有源电力滤波器(APF)仿真研究。主要内容涵盖并联型APF的工作原理、三相三电平NPC结构、谐波检测方法(ipiq)、双闭环控制策略(电压外环+电流内环PI控制)以及SVPWM矢量调制技术。仿真结果显示,在APF投入前后,电网电流THD从21.9%降至3.77%,显著提高了电能质量。 适用人群:从事电力系统研究、电力电子技术开发的专业人士,尤其是对有源电力滤波器及其仿真感兴趣的工程师和技术人员。 使用场景及目标:适用于需要解决电力系统中谐波污染和无功补偿问题的研究项目。目标是通过仿真验证APF的有效性和可行性,优化电力系统的电能质量。 其他说明:文中提到的仿真模型涉及多个关键模块,如三相交流电压模块、非线性负载、信号采集模块、LC滤波器模块等,这些模块的设计和协同工作对于实现良好的谐波抑制和无功补偿至关重要。