关于jquery性能最佳实践的讨论,与求教


Posted in Javascript onMarch 30, 2012

原因是我在测试的时候:带入了错误的变量。具体可以查看图片上的 $(parentID > childClass) 我直接比较两个字符换大小了!
感谢 html5中文网 QQ群中的 “不见丘比特”。

其中第三点提到父元素与子元素的关系中提到了 从父元素选择子元素的用例:

 $('.child', $parent) 
$parent.find('.child') 

$parent.children('.child') 

$('#parent > .child') 

$('#parent .child') 

$('.child', $('#parent'))

在其所给的测试用例中 确实是使用jquery的find方法最快,但是稍作修改却得到了另外的一个结果$('#parent > .child')完胜。

在作者的用例中只是直接缓存了对象 $('#parent');但是当我们把dom的id和class属性作为常量定义并传入测试用例中的时候就出现我说的另外一个结果。
作者原生测试页面:http://jsperf.com/bell-selector
结果截图:
关于jquery性能最佳实践的讨论,与求教
修改后的测试页面:http://jsperf.com/bell-selector/2
结果截图:
关于jquery性能最佳实践的讨论,与求教

同时给我我从真实环境中取出来的一块代码段所做的测试,同样也是$('#parent > .child')这样的写法最快。
测试页面:http://jsperf.com/findchildren
结果截图:
关于jquery性能最佳实践的讨论,与求教
从以上结果截图中可以看到,我给出的两个测试结果明显是使用了大于号选择符的那个性能做好。

请各位看到此文或者了解详情的能给一个说明。关于文章中的其它内容都是比较好的观点。
文章:https://3water.com/article/28056.htm

园子中那位有时间和条件的可以对以上各个操作做一次调试,给出详细的流程说明。我要等到手中的项目做完才有时间来调试这个过程。

Javascript 相关文章推荐
理解JavaScript中的事件
Sep 23 Javascript
jQuery EasyUI API 中文文档 搜索框
Sep 29 Javascript
jquery阻止后续事件只执行第一个事件
Jul 24 Javascript
全系IE支持Bootstrap的解决方法
Oct 19 Javascript
实例讲解Jquery中隐藏hide、显示show、切换toggle的用法
May 13 Javascript
JavaScript的ExtJS框架中数面板TreePanel的使用实例解析
May 21 Javascript
javascript的replace方法结合正则使用实例总结
Jun 16 Javascript
JS实现类似百叶窗下拉菜单效果
Dec 30 Javascript
JS实现中国公民身份证号码有效性验证
Feb 20 Javascript
javascript实现获取一个日期段内每天不同的价格(计算入住总价格)
Feb 05 Javascript
微信小程序自定义可滑动日历界面
Dec 28 Javascript
Vue项目总结之webpack常规打包优化方案
Jun 06 Javascript
从面试题学习Javascript 面向对象(创建对象)
Mar 30 #Javascript
jQuery 自定义函数写法分享
Mar 30 #Javascript
一个JQuery操作Table的代码分享
Mar 30 #Javascript
javascript工具库代码
Mar 29 #Javascript
Web开发之JavaScript
Mar 29 #Javascript
CodeMirror2 IE7/IE8 下面未知运行时错误的解决方法
Mar 29 #Javascript
javascript对talbe进行动态添加、删除、验证实现代码
Mar 29 #Javascript
You might like
编写自己的php扩展函数
2006/10/09 PHP
php mysqli查询语句返回值类型实例分析
2016/06/29 PHP
Yii2 中实现单点登录的方法
2018/03/09 PHP
Laravel 6.2 中添加了可调用容器对象的方法
2019/10/22 PHP
JQuery 获得绝对,相对位置的坐标方法
2010/02/09 Javascript
制作jquery遮罩层效果导航菜单代码分享
2013/12/25 Javascript
深入理解javascript变量声明
2014/11/20 Javascript
JavaScript函数学习总结以及相关的编程习惯指南
2015/11/16 Javascript
第一次接触神奇的前端框架vue.js
2016/12/01 Javascript
JavaScript注入漏洞的原理及防范(详解)
2016/12/04 Javascript
理解Angular的providers给Http添加默认headers
2017/07/04 Javascript
JS图片轮播与索引变色功能实例详解
2017/07/06 Javascript
JS实现基于Sketch.js模拟成群游动的蝌蚪运动动画效果【附demo源码下载】
2017/08/18 Javascript
JavaScript表单即时验证 验证不成功不能提交
2017/08/31 Javascript
纯JavaScript实现实时反馈系统时间
2017/10/26 Javascript
几个你不知道的技巧助你写出更优雅的vue.js代码
2018/06/11 Javascript
JavaScript实现的简单Tab点击切换功能示例
2018/07/06 Javascript
JavaScript中的this妙用实例分析
2020/05/09 Javascript
js实现省级联动(数据结构优化)
2020/07/17 Javascript
在Vue中使用Viser说明(基于AntV-G2可视化引擎)
2020/10/28 Javascript
微信小程序实现可拖动悬浮图标(包括按钮角标的实现)
2020/12/29 Javascript
[01:05:52]DOTA2-DPC中国联赛 正赛 Ehome vs Aster BO3 第一场 2月2日
2021/03/11 DOTA
简单讲解Python中的数字类型及基本的数学计算
2016/03/11 Python
Python实现随机创建电话号码的方法示例
2018/12/07 Python
Python实现基于SVM的分类器的方法
2019/07/19 Python
python代码xml转txt实例
2020/03/10 Python
在Python3.74+PyCharm2020.1 x64中安装使用Kivy的详细教程
2020/08/07 Python
小学学校评估方案
2014/06/08 职场文书
先进员工获奖感言
2014/08/14 职场文书
2014年重阳节老干部座谈会局领导发言稿
2014/09/25 职场文书
工作失职检讨书
2015/01/26 职场文书
辛亥革命观后感
2015/06/02 职场文书
晚会开幕词范文
2016/03/04 职场文书
Java如何实现通过键盘输入一个数组
2022/02/15 Java/Android
Python+Selenium实现抖音、快手、B站、小红书、微视、百度好看视频、西瓜视频、微信视频号、搜狐视频、一点号、大风号、趣头条等短视频自动发布
2022/04/13 Python
Java 使用类型为Object的变量指向任意类型的对象
2022/04/13 Java/Android