一段效率很高的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创建对象的几种常用方式小结(推荐)
Oct 24 Javascript
javascript hashtable 修正版 下载
Dec 30 Javascript
编写针对IE的JS代码两种编写方法
Jan 30 Javascript
getJSON调用后台json数据时函数被调用两次的原因猜想
Sep 29 Javascript
js获取IFRAME当前的URL的方法
Nov 13 Javascript
javascript cookie的基本操作(添加和删除)
Jul 24 Javascript
gulp安装以及打包合并的方法教程
Nov 19 Javascript
关于axios不能使用Vue.use()浅析
Jan 12 Javascript
浅谈Webpack 持久化缓存实践
Mar 22 Javascript
vue-cli打包后本地运行dist文件中的index.html操作
Aug 12 Javascript
逐行分析鸿蒙系统的 JavaScript 框架(推荐)
Sep 17 Javascript
element-ui中dialog弹窗关闭按钮失效的解决
Sep 22 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的无限分类实现想法~
2007/01/02 PHP
PHP开发中四种查询返回结果分析
2011/01/02 PHP
Yii2简单实现多语言配置的方法
2016/07/23 PHP
php微信公众号开发之微信企业付款给个人
2018/10/04 PHP
PHP设计模式之单例模式定义与用法分析
2019/03/26 PHP
php 多继承的几种常见实现方法示例
2019/11/18 PHP
JQERY limittext 插件0.2版(长内容限制显示)
2010/08/27 Javascript
基于Jquery的开发个代阴影的对话框效果代码
2011/07/28 Javascript
JS 操作符整理[推荐收藏]
2011/11/15 Javascript
跟我学Nodejs(一)--- Node.js简介及安装开发环境
2014/05/20 NodeJs
node.js中的fs.statSync方法使用说明
2014/12/16 Javascript
jQuery选择器源码解读(五):tokenize的解析过程
2015/03/31 Javascript
jQuery实现的个性化返回底部与返回顶部特效代码
2015/10/30 Javascript
Javascript中的Prototype到底是什么
2016/02/16 Javascript
jquery动态切换背景图片的简单实现方法
2016/05/14 Javascript
Javascript实现图片不间断滚动的代码
2016/06/22 Javascript
Angular设置title信息解决SEO方面存在问题
2016/08/19 Javascript
详解如何将 Vue-cli 改造成支持多页面的 history 模式
2017/11/20 Javascript
微信小程序实现留言板(Storage)
2018/11/02 Javascript
Node.js事件的正确使用方法
2019/04/05 Javascript
了解javascript中的Dom操作
2019/05/27 Javascript
微信小程序 下拉刷新及上拉加载原理解析
2019/11/06 Javascript
[01:14]英雄,所敬略同——2018完美盛典宣传视频4K
2018/12/05 DOTA
Python中存取文件的4种不同操作
2018/07/02 Python
对Python定时任务的启动和停止方法详解
2019/02/19 Python
解决Python3用PIL的ImageFont输出中文乱码的问题
2019/08/22 Python
Tensorflow中的dropout的使用方法
2020/03/13 Python
解决reload(sys)后print失效的问题
2020/04/25 Python
浅谈如何使用python抓取网页中的动态数据实现
2020/08/17 Python
python 如何使用find和find_all爬虫、找文本的实现
2020/10/16 Python
python 使用xlsxwriter循环向excel中插入数据和图片的操作
2021/01/01 Python
新西兰领先的内衣店:Bendon Lingerie新西兰
2018/07/11 全球购物
Ben Sherman官方网站:英国男装品牌
2019/10/22 全球购物
外包公司软件测试工程师
2014/11/01 面试题
留学推荐信英文范文
2015/03/26 职场文书
Python制作春联的示例代码
2022/01/22 Python