一段效率很高的for循环语句使用方法


Posted in Javascript onAugust 13, 2007

给表格的每行加上样式,注意for的第二个参数,当数组下标越界时,row=row[i]返回false,到此循环结束。

var rows = document.getElementsByTagName('tr');
for( var i = 0, row; row = rows[i]; i++ ) {
  row.className = 'newclass';
}
测试代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style>
li { margin-left:28px;}
.abc {background-color:#eee;font-size:14px; margin-bottom:10px;}
</style>
<SCRIPT LANGUAGE="JavaScript">
<!--
function a(){
 var row = document.getElementsByTagName("li");
 var t1 = new Date();
 for (var i=0,j; j=row[i]; i++)
 {
  j.className="abc";
 }
 var t2 = new Date();
 alert("耗时 "+(t2-t1).toString()+" 毫秒");
}
function b(){
 var row = document.getElementsByTagName("li");
 var t1 = new Date();
 for (var i=0; i<row.length; i++)
 {
  row[i].className="abc";
 }
 var t2 = new Date();
 alert("耗时 "+(t2-t1).toString()+" 毫秒");
}
function c(){
 var j="<ol>";
 for (var i=0; i<2000; i++)
 {
  j=j+"<li>测试文字</li>";
 }
 j=j+"</ol>";
 document.getElementById("box").innerHTML = j;
}
//-->
</SCRIPT>
</head>
<BODY>
<input type="button" value="CreateTable" onclick="c()" />
<input type="button" value="Test old method!" onclick="b()" />
<input type="button" value="Test new method!" onclick="a()" />
<input type="button" value="Clear" onclick="document.getElementById('box').innerHTML='';" />
<div id="box"></div>
</BODY>
</HTML>

Javascript 相关文章推荐
ie focus bug 解决方法
Sep 03 Javascript
将jQuery应用于login页面的问题及解决
Oct 17 Javascript
js限制文本框只能输入中文的方法
Aug 11 Javascript
深入理解逻辑表达式的用法 与或非的用法
Jun 06 Javascript
JavaScript编程中实现对象封装特性的实例讲解
Jun 24 Javascript
微信和qq时间格式模板实例详解
Oct 21 Javascript
原生JS下拉加载插件分享
Dec 26 Javascript
Three.js利用性能插件stats实现性能监听的方法
Sep 25 Javascript
p5.js绘制旋转的正方形
Oct 23 Javascript
jQuery中event.target和this的区别详解
Aug 13 jQuery
vue实现登录、注册、退出、跳转等功能
Dec 23 Vue.js
使用Ajax实现进度条的绘制
Apr 07 Javascript
javascript实现轮显新闻标题链接
Aug 13 #Javascript
document.open() 与 document.write()的区别
Aug 13 #Javascript
js小技巧--自动隐藏红叉叉
Aug 13 #Javascript
javascript据option的value值快速设定初始的selected选项
Aug 13 #Javascript
用js实现随机返回数组的一个元素
Aug 13 #Javascript
JavaScript 模仿vbs中的 DateAdd() 函数的代码
Aug 13 #Javascript
用JavaScript 处理 URL 的两个函数代码
Aug 13 #Javascript
You might like
给初学者的30条PHP最佳实践(荒野无灯)
2011/08/02 PHP
Linux下PHP连接Oracle数据库
2014/08/20 PHP
php格式化日期实例分析
2014/11/12 PHP
PHP之sprintf函数用法详解
2014/11/12 PHP
[原创]php简单防盗链验证实现方法
2016/07/09 PHP
php文件上传及下载附带显示文件及目录功能
2017/04/27 PHP
兼容Mozilla必须知道的知识。
2007/01/09 Javascript
禁止js文件缓存的代码
2010/04/09 Javascript
jQuery.buildFragment使用方法及思路分析
2013/01/07 Javascript
提高jQuery性能的十个诀窍
2013/11/14 Javascript
单击某一段文字改写文本颜色
2014/06/06 Javascript
下一代Bootstrap的5个特点 超酷炫!
2016/06/17 Javascript
使用bat打开多个cmd窗口执行gulp、node
2017/02/17 Javascript
vue-cli 构建骨架屏的方法示例
2018/11/08 Javascript
JavaScript错误处理操作实例详解
2019/01/04 Javascript
react项目如何使用iconfont的方法步骤
2019/03/13 Javascript
微信小程序select下拉框实现效果
2019/05/15 Javascript
发布订阅模式在vue中的实际运用实例详解
2019/06/09 Javascript
JavaScript迭代器的含义及用法
2019/06/21 Javascript
nodejs环境使用Typeorm连接查询Oracle数据
2019/12/05 NodeJs
[42:11]TNC vs Pain 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/20 DOTA
python中enumerate的用法实例解析
2014/08/18 Python
python处理Excel xlrd的简单使用
2017/09/12 Python
python实现跨excel的工作表sheet之间的复制方法
2018/05/03 Python
python使用循环打印所有三位数水仙花数的实例
2018/11/13 Python
详解Scrapy Redis入门实战
2020/11/18 Python
颇特女士:NET-A-PORTER(直邮中国)
2020/07/11 全球购物
中英文自我评价常用句型
2013/12/19 职场文书
什么样的创业计划书可行性高?
2014/02/01 职场文书
企业精细化管理实施方案
2014/03/23 职场文书
春节请假条
2014/04/11 职场文书
新书发布会策划方案
2014/06/09 职场文书
法院干警四风问题自我剖析材料
2014/09/29 职场文书
《圆的周长》教学反思
2016/02/17 职场文书
委托开发合同书(标准版)
2019/08/07 职场文书
从贫穷到富有,是知识技能和学习力的差别
2019/08/20 职场文书