jquery find选择器在不同浏览器下的差异
初步测试,5000个节点的隐藏。
代码如下:
<!doctype html>
<html lang="en">
<head>
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div>
<ul></ul>
</div>
<script>
var html = "";
for(var i=0;i<5000;i++){
var $m = '<li><a></a></li>';
html += $m;
}
$("body").find("ul").append(html);
var time = new Date().getTime();
$("body").find("a").hide();
var endtime = new Date().getTime();
console.log("find cost" + (endtime-time));
time = new Date().getTime();
$("body a").hide();
endtime = new Date().getTime();
console.log("find cost" + (endtime-time));</script>
</body>
</html>
IE7下find = 501ms,css =731ms
IE11下find = 216ms , css = 32ms
chrome下find = 683ms , css = 93ms
firefox下 find = 285ms , css = 260ms
safari find = 294ms , css= 105ms
可能是因为IE7以下不存在css选择器原生方法,jquery针对此采用的sizzle引擎虽有所优化,但仍不及find方法。
综合来说,现代浏览器(IE6,7除外)在CSS选择节点的执行效率上由于原生方法的优势均不同程度的有所提高。
因此,在使用jquery时,若兼容在IE8以上的,则可以无脑采用css选择器,若考虑到IE6,7,则需要有针对性的使用find() (IE6,7)和 css选择器(IE8及以上)。
参考:http://hi.baidu.com/xujie2453/item/6258f4d8eb315230e3108f3f
jquery find选择器在不同浏览器下的差异的更多相关文章
- jQuery ajax方法在Chrome浏览器下失效问题
最近做测试时碰到一个问题,chrome下使用ajax的一些方法(如get,load等)的时候完全失效: $(function() { $("#send").click(functi ...
- jquery中ajax在firefox浏览器下“object XMLDocument”返回结果的解决办法
asp.net中借助jquery的ajax处理功能,使用起来很方便.但是在firefox下获得的data报错object XMLDocument.这是因为默认的情况下把datatype用html来解析 ...
- ASP.NET MVC 使用Jquery Uploadify 在非IE浏览器下Http Error的解决方案
解决Uploadify上传控件在非IE浏览器中不工作,需要做如下2步修改: 1.Global.asax文件中,实现Application_BeginRequest函数: void Applicatio ...
- IE7浏览器下CSS属性选择器二三事
一.为何专门说起IE7 以前,或者说数年前,我们从事桌面端网页开发的时候,基本上都还要兼顾IE6浏览器, 即使有些特性,IE7支持,我们也会忽略之.于是,我们会不自然地把IE6和IE7浏览器归为一路货 ...
- 360浏览器下jquery.validate.unobtrusive的日期验证问题
今天在招聘频道(job.cnblogs.com)遭遇这样一个问题——在360浏览器下,在一个表单验证中,虽然输入了有效的日期,却总是提示日期格式错误,见下图: 而在Chrome/Safari/Fire ...
- jquery的slideUp、slideDown、slideToggle等涉及滑动效果的一系列函数,在IE浏览器下有几处bug
jquery的slideUp.slideDown.slideToggle等涉及滑动效果的一系列函数,在IE浏览器下有几处bug: 1. 因position引起的问题 影响:IE全系列 症状:在需要sl ...
- HTML 学习笔记 JQuery(选择器)
学习前端也有一段时间了,今天终于进入到JQuery阶段了,对于新手来讲,JQuery的选择器类型之多 功能之强大实在不是一天两天能够记得完的.现在,就采用边学边记录的方式.以后要是忘了的话,也有一个地 ...
- python 全栈开发,Day53(jQuery的介绍,jQuery的选择器,jQuery动画效果)
js总结 js: 1.ECMAScript5 ES5语法 2.DOM CRUD 获取 3种方式 id tag className //面向对象 对象 : 属性和方法 某个对象中 function $( ...
- jquery及jquery常用选择器使用
本文为博主原创,未经允许不得转载: 1.jquery强大之处: 容易上手,强大的选择器,解决浏览器的兼容 完善的时间机制,出色的ajax封装,丰富的ui 2.jquery是一个javas ...
随机推荐
- logstash 处理各种时间格式
tomcat access日志: { "@version" => "1", "@timestamp" => "2016 ...
- bzoj1221
网络流与线性规划24题中的餐巾计划吧明显要拆点吧,把每一天拆成2个点,i,i+n起点 终点 容量 费用 s i inf c 每天都可以购买新毛巾 i ...
- hiho #1055 : 刷油漆
上回说到,小Ho有着一棵灰常好玩的树玩具!这棵树玩具是由N个小球和N-1根木棍拼凑而成,这N个小球都被小Ho标上了不同的数字,并且这些数字都是处于1..N的范围之内,每根木棍都连接着两个不同的小球,并 ...
- 字符串(KMP):BZOJ 3670 [Noi2014]动物园
3670: [Noi2014]动物园 Time Limit: 10 Sec Memory Limit: 512 MBSubmit: 1521 Solved: 813[Submit][Status] ...
- 网络流(最大流) POJ 1637 Sightseeing tour
Sightseeing tour Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 8628 Accepted: 3636 ...
- Codeforces 716B Complete the Word【模拟】 (Codeforces Round #372 (Div. 2))
B. Complete the Word time limit per test 2 seconds memory limit per test 256 megabytes input standar ...
- GeoPandas官方中文文档--译著
译自GeoPandas 0.1.0 文档(原版译著,有错误欢迎交流,转载请注明) GeoPandas是一个开源项目,它的目的是使得在Python下更方便的处理地理空间数据.GeoPandas扩展了pa ...
- Android Proguard
Android Proguard 14 May 2015 语法 -include {filename} 从给定的文件中读取配置参数 -basedirectory {directoryname} 指定基 ...
- Jenkins 十二: 集成 selenium 测试
我的selenium采用的是python版本. 其实 selenium java版本也类似. 1. 在jenkins里面新建selenium 测试项目. 源码管理采用 “Subversion”,输入 ...
- Mysql Binlog日志详解
一.Mysql Binlog格式介绍 Mysql binlog日志有三种格式,分别为Statement,MiXED,以及ROW! 1.Statement:每一条会修改数据的sql都会记录在 ...