一段效率很高的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 相关文章推荐
突发奇想的一个jquery插件
Nov 19 Javascript
jquery.blockUI.js上传滚动等待效果实现思路及代码
Mar 18 Javascript
jQuery基本过滤选择器使用介绍
Apr 18 Javascript
JS 获取select(多选下拉)中所选值的示例代码
Aug 02 Javascript
js中的内部属性与delete操作符介绍
Aug 10 Javascript
详解JS面向对象编程
Jan 24 Javascript
javascript构造函数以及原型对象的理解
Jan 13 Javascript
JS表单数据验证的正则表达式(常用)
Feb 18 Javascript
jQuery实现贪吃蛇小游戏(附源码下载)
Mar 04 Javascript
vue中阻止click事件冒泡,防止触发另一个事件的方法
Feb 08 Javascript
Angular学习教程之RouterLink花式跳转
May 03 Javascript
使用layui监听器监听select下拉框,事件绑定不成功的解决方法
Sep 28 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的引用计数机制
2013/06/14 PHP
推荐一本PHP程序猿都应该拜读的书
2014/12/31 PHP
PHP高并发和大流量解决方案整理
2019/12/24 PHP
javascript call方法使用说明
2010/01/11 Javascript
网页下载文件期间如何防止用户对网页进行其他操作
2014/06/27 Javascript
js实现图片在未加载完成前显示加载中字样
2014/09/03 Javascript
JS实现的倒计时效果实例(2则实例)
2015/12/23 Javascript
js实现页面跳转的几种方法小结
2016/05/16 Javascript
超全面的javascript中变量命名规则
2017/02/09 Javascript
vue一步步实现alert功能
2017/07/05 Javascript
js html实现计算器功能
2018/11/13 Javascript
Angular刷新当前页面的实现方法
2018/11/21 Javascript
微信小程序控制台提示warning:Now you can provide attr &quot;wx:key&quot; for a &quot;wx:for&quot; to improve performance解决方法
2019/02/21 Javascript
Vue export import 导入导出的多种方式与区别介绍
2020/02/12 Javascript
vue中用 async/await 来处理异步操作
2020/07/18 Javascript
vue-路由精讲 二级路由和三级路由的作用
2020/08/06 Javascript
[04:49]2014DOTA2国际邀请赛 Newbee顺利挺进总决赛 ImbaTV独家专访
2014/07/19 DOTA
Python简单读取json文件功能示例
2017/11/30 Python
pyqt5 使用label控件实时显示时间的实例
2019/06/14 Python
Django中celery执行任务结果的保存方法
2019/07/12 Python
python协程gevent案例 爬取斗鱼图片过程解析
2019/08/27 Python
使用python自动追踪你的快递(物流推送邮箱)
2020/03/17 Python
CSS书写规范、顺序和命名规则
2014/03/06 HTML / CSS
英国汽车座椅和婴儿车购物网站:Uber Kids
2017/04/19 全球购物
电气自动化自荐信
2013/10/10 职场文书
车祸赔偿收入证明
2014/01/09 职场文书
办公室副主任职责范本
2014/03/08 职场文书
《风筝》教学反思
2014/04/10 职场文书
单位承诺书格式
2014/05/21 职场文书
学校先进集体事迹材料
2014/05/31 职场文书
2015年元旦文艺晚会总结(学院)
2014/11/28 职场文书
承诺书范本
2015/01/21 职场文书
高三数学教学反思
2016/02/18 职场文书
使用react+redux实现计数器功能及遇到问题
2021/06/02 Javascript
javascript canvas实现雨滴效果
2021/06/09 Javascript
戴尔Win11系统no bootable devices found解决教程
2022/09/23 数码科技