关于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 相关文章推荐
jQuery自定义事件的简单实现代码
Jan 27 Javascript
jQuery DOM删除节点操作指南
Mar 03 Javascript
基于JavaScript代码实现随机漂浮图片广告
Jan 05 Javascript
jQuery中的AjaxSubmit使用讲解
Sep 25 Javascript
老生常谈javascript的类型转换
Oct 12 Javascript
vue2.0 中#$emit,$on的使用详解
Jun 07 Javascript
DataTables添加额外的查询参数和删除columns等无用参数实例
Jul 04 Javascript
vuejs父子组件之间数据交互详解
Aug 09 Javascript
基于JavaScript实现评论框展开和隐藏功能
Aug 25 Javascript
微信小程序开发之转发分享功能
Oct 22 Javascript
js常用方法、检查是否有特殊字符串、倒序截取字符串操作完整示例
Jan 26 Javascript
11个Javascript小技巧帮你提升代码质量(小结)
Dec 28 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 8小时时间差的解决方法小结
2009/12/22 PHP
Drupal7 form表单二次开发要点与实例
2014/03/02 PHP
php实现mysql数据库连接操作及用户管理
2015/11/08 PHP
提交表单后 PHP获取提交内容的实现方法
2016/05/25 PHP
top.location.href 没有权限 解决方法
2008/08/05 Javascript
转换字符串为json对象的方法详解
2013/11/29 Javascript
jquery实现向下滑出的二级导航下滑菜单效果
2015/08/25 Javascript
Jquery uploadify 多余的Get请求(404错误)的解决方法
2017/01/26 Javascript
jquery Ajax实现Select动态添加数据
2017/06/08 jQuery
原生JS实现Ajax跨域请求flask响应内容
2017/10/24 Javascript
浅谈Node 调试工具入门教程
2018/03/20 Javascript
vue使用codemirror的两种用法
2019/08/27 Javascript
vue仿ios列表左划删除
2019/09/26 Javascript
原生js实现的金山打字小游戏(实例代码详解)
2020/03/16 Javascript
jquery实现简易验证插件封装
2020/09/13 jQuery
python使用PyFetion来发送短信的例子
2014/04/22 Python
python读取word文档的方法
2015/05/09 Python
Python中的fileinput模块的简单实用示例
2015/07/09 Python
Python数据类型详解(三)元祖:tuple
2016/05/08 Python
Python操作SQLite数据库的方法详解【导入,创建,游标,增删改查等】
2017/07/11 Python
对python自动生成接口测试的示例讲解
2018/11/30 Python
python爬虫获取小区经纬度以及结构化地址
2018/12/30 Python
Python根据当前日期取去年同星期日期
2019/04/14 Python
Python和Java的语法对比分析语法简洁上python的确完美胜出
2019/05/10 Python
python用win32gui遍历窗口并设置窗口位置的方法
2019/07/26 Python
python hash每次调用结果不同的原因
2019/11/21 Python
python GUI库图形界面开发之PyQt5开发环境配置与基础使用
2020/02/25 Python
python由已知数组快速生成新数组的方法
2020/04/08 Python
解决jupyter notebook 前面书写后面内容消失的问题
2020/04/13 Python
学校介绍信范文
2014/01/14 职场文书
企业节能减排实施方案
2014/03/19 职场文书
仲裁协议书
2014/09/26 职场文书
鉴史问廉观后感
2015/06/10 职场文书
浅谈Python numpy创建空数组的问题
2021/05/25 Python
sql中mod()函数取余数的用法
2021/05/29 SQL Server
CentOS7安装MySQL8的超级详细教程(无坑!)
2022/06/10 Servers