JQuery for与each性能比较分析


Posted in Javascript onMay 14, 2013

最近在做一个性能优化方面的工作,遇到很多细节问题,现在一一把遇到的问题记录下来分享给大家,废话就不多谢,我直接贴代码。

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
<title>for与each性能比较</title> 
<script src="../Cks/jquery-1.7.1.min.js" type="text/javascript"></script> 
<script type="text/javascript" language="javascript"> 
function getSelectLength() { 
var time1 = new Date().getTime(); 
var len = $("#select_test").find("option").length; 
var selectObj = $("#select_test"); 
for (var i = 0; i < len; i++) { 
if (selectObj.get(0).options[i].text == "111111") { 
selectObj.get(0).options[i].selected = true; 
break; 
} 
} 
var time2 = new Date().getTime(); 
alert("for循环执行时间:" + (time2 - time1)); 
time1 = new Date().getTime(); 
$("#select_test").find("option").each(function () { 
if ($(this).text() == "111111") { 
$(this)[0].selected = true; 
} 
}); 
time2 = new Date().getTime(); 
alert("each循环执行时间:" + (time2 - time1)); 
} 
</script> 
</head> 
<body> 
<form id="form1" runat="server"> 
<div><select id="select_test"> 
<option value='1'>111111</option> 
<option value='2'>222222</option> 
<option value='3'>333333</option> 
<option value='4'>444444</option> 
<option value='5'>5</option> 
<option value='6'>6</option> 
<option value='7'>7</option> 
<option value='8'>8</option> 
<option value='9'>9</option> 
<option value='10'>10</option> 
<option value='11'>11</option> 
<option value='12'>12</option> 
<option value='13'>13</option> 
<option value='14'>14</option> 
<option value='15'>15</option> 
<option value='16'>16</option> 
<option value='17'>17</option> 
<option value='18'>18</option> 
<option value='19'>19</option> 
<option value='20'>20</option> 
</select><input type="button" value="开始比较" onclick="getSelectLength();" /></div> 
<div> 
</form> 
</body> 
</html>

输入出入
for循环执行时间:1
each循环执行时间:3
两次结果直接说明了问题。
Javascript 相关文章推荐
CSS常用网站布局实例
Apr 03 Javascript
jquery插件制作简单示例说明
Feb 03 Javascript
jQuery.holdReady()使用方法
May 20 Javascript
JS动态加载当前时间的方法
Feb 09 Javascript
jQuery支持添加事件的日历特效代码分享(3种样式)
Aug 24 Javascript
原生JS实现网络彩票投注效果
Sep 25 Javascript
原生JS查找元素的方法(推荐)
Nov 22 Javascript
node学习记录之搭建web服务器教程
Feb 16 Javascript
Async Validator 异步验证使用说明
Jul 03 Javascript
基于mpvue的小程序项目搭建的步骤
May 22 Javascript
解决JS表单验证只有第一个IF起作用的问题
Dec 04 Javascript
highcharts.js数据绑定方式代码实例
Nov 13 Javascript
禁用键盘上的(全局)指定键兼容iE、Chrome、火狐
May 14 #Javascript
解析使用js判断只能输入数字、字母等验证的方法(总结)
May 14 #Javascript
使用js检测浏览器的实现代码
May 14 #Javascript
Javascript 垃圾收集机制介绍理解
May 14 #Javascript
JavaScript实现GriwView单列全选(自写代码)
May 13 #Javascript
jquery实现漂浮在网页右侧的qq在线客服插件示例
May 13 #Javascript
js 程序执行与顺序实现详解
May 13 #Javascript
You might like
PHP下通过系统信号量加锁方式获取递增序列ID
2009/09/25 PHP
php中time()与$_SERVER[REQUEST_TIME]用法区别
2014/11/19 PHP
PHP进程通信基础之信号
2017/02/19 PHP
php表单处理操作
2017/11/16 PHP
Javascript实例教程(19) 使用HoTMetal(3)
2006/12/23 Javascript
Gird组件 Part-3:范例RSSFeed Viewer
2007/03/10 Javascript
来自qq的javascript面试题
2010/07/24 Javascript
使用Jquery打造最佳用户体验的登录页面的实现代码
2011/07/08 Javascript
js中判断Object、Array、Function等引用类型对象是否相等
2012/08/29 Javascript
NodeJs的优势和适合开发的程序
2016/08/14 NodeJs
JavaScript实现按键精灵的原理分析
2017/02/21 Javascript
setTimeout函数的神奇使用
2017/02/26 Javascript
微信小程序页面间通信的5种方式
2017/03/31 Javascript
weex slider实现滑动底部导航功能
2017/08/28 Javascript
VUE在for循环里面根据内容值动态的加入class值的方法
2018/08/12 Javascript
解决vue无法设置滚动位置的问题
2018/10/07 Javascript
详解如何使用nvm管理Node.js多版本
2019/05/06 Javascript
JavaScript获取当前url路径过程解析
2019/12/27 Javascript
详解Vue 单文件组件的三种写法
2020/02/19 Javascript
JS中的继承操作实例总结
2020/06/06 Javascript
如何正确解决VuePress本地访问出现资源报错404的问题
2020/12/03 Vue.js
[01:48]完美圣典齐天大圣至宝宣传片
2016/12/17 DOTA
python检测某个变量是否有定义的方法
2015/05/20 Python
启动Atom并运行python文件的步骤
2018/11/09 Python
Python面向对象程序设计示例小结
2019/01/30 Python
Python脚本导出为exe程序的方法
2020/03/25 Python
GWT的应用有哪两种部署模式
2012/12/21 面试题
大学毕业生个人自荐信范文
2014/01/08 职场文书
学习标兵获奖感言
2014/02/20 职场文书
《有趣的发现》教学反思
2014/04/15 职场文书
机械电子工程专业自荐书
2014/06/10 职场文书
个人汇报材料范文
2014/12/30 职场文书
雨雪天气温馨提示
2015/07/15 职场文书
小米11和iphone12哪个值得买?小米11对比iphone12评测
2021/04/21 数码科技
Spring this调用当前类方法无法拦截的示例代码
2022/03/20 Java/Android
Python中Matplotlib的点、线形状、颜色以及绘制散点图
2022/04/07 Python