一段效率很高的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 相关文章推荐
JS+ACTIVEX实现网页选择本地目录路径对话框
Mar 18 Javascript
动态加载script文件的两种方法
Aug 15 Javascript
jquery表单验证框架提供的身份证验证方法(示例代码)
Dec 27 Javascript
JQuery中使用Ajax赋值给全局变量异常的解决方法
Jan 10 Javascript
jQuery中的read和JavaScript中的onload函数的区别
Aug 27 Javascript
JS控制FileUpload的上传文件类型实例代码
Oct 07 Javascript
jQuery Checkbox 全选 反选的简单实例
Nov 29 Javascript
JavaScript中的普通函数和箭头函数的区别和用法详解
Mar 21 Javascript
微信小程序 后台登录(非微信账号)实例详解
Mar 31 Javascript
socket.io实现在线群聊功能
Apr 07 Javascript
vue  自定义组件实现通讯录功能
Sep 30 Javascript
vue+web端仿微信网页版聊天室功能
Apr 30 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
PHP防盗链代码实例
2014/08/27 PHP
Java中final关键字详解
2015/08/10 PHP
cakephp2.X多表联合查询join及使用分页查询的方法
2017/02/23 PHP
PHP PDOStatement::setAttribute讲解
2019/02/01 PHP
PHP设计模式概论【概念、分类、原则等】
2020/05/01 PHP
初窥JQuery(二)事件机制(2)
2010/12/06 Javascript
使用cluster 将自己的Node服务器扩展为多线程服务器
2014/11/10 Javascript
Jquery对新插入的节点 绑定Click事件失效的解决方法
2016/06/02 Javascript
微信小程序 Record API详解及实例代码
2016/09/30 Javascript
js基本算法:冒泡排序,二分查找的简单实例
2016/10/08 Javascript
bootstrap模态框实现拖拽效果
2016/12/14 Javascript
Easyui笔记2:实现datagrid多行删除的示例代码
2017/01/14 Javascript
超出JavaScript安全整数限制的数字计算BigInt详解
2018/06/24 Javascript
angular2实现统一的http请求头方法
2018/08/13 Javascript
vue 在服务器端直接修改请求的接口地址
2020/12/19 Vue.js
在JavaScript中查找字符串中最长单词的三种方法(推荐)
2021/01/18 Javascript
js动态添加带圆圈序号列表的实例代码
2021/02/18 Javascript
[36:52]DOTA2真视界:基辅特锦赛总决赛
2017/05/21 DOTA
Python实现对象转换为xml的方法示例
2017/06/08 Python
深入理解Python中range和xrange的区别
2017/11/26 Python
浅谈flask中的before_request与after_request
2018/01/20 Python
Python利用Django如何写restful api接口详解
2018/06/08 Python
Python检查和同步本地时间(北京时间)的实现方法
2018/12/03 Python
python学习开发mock接口
2019/04/28 Python
Python pandas实现excel工作表合并功能详解
2019/08/29 Python
基于h5py的使用及数据封装代码
2019/12/26 Python
python pycharm最新版本激活码(永久有效)附python安装教程
2020/09/18 Python
分享PyCharm最新激活码(真永久激活方法)不用每月找安装参数或最新激活码了
2020/12/27 Python
英国领先的在线高尔夫设备零售商:Golfgeardirect
2020/12/11 全球购物
医学院学生求职简历的自我评价
2013/10/24 职场文书
关爱女孩行动实施方案
2014/03/13 职场文书
食品委托检验协议书范本
2014/09/12 职场文书
2014年技术工作总结范文
2014/11/20 职场文书
关于感谢信的范文
2015/01/23 职场文书
教师节领导致辞
2015/07/29 职场文书
创业计划书之奶茶店开店方案范本!
2019/08/06 职场文书