Javascript遍历Html Table示例(包括内容和属性值)


Posted in Javascript onJuly 08, 2014

1: 遍历并输出Table中值

<table id="tb">
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
</table>
function f()
{
var t=document.getElementById("tb").childNodes.item(0);
for(var i=0;i< t.childNodes.length;i++)
{
for(var j=0;j<t.childNodes(i).childNodes.length;j++)
{
alert(t.childNodes(i).childNodes(j).innerText);
}
}
}

2: 遍历Table,读取CheckBox状态和其他Column值

<!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> <title>Untitled Page</title> </head> <body onload="f()"> 
<script type="text/javascript"> 
function f()
{
var t=document.getElementById("tb").childNodes.item(0);

for(var i=0;i< t.childNodes.length;i++)
{
alert(t.childNodes(i).firstChild.firstChild.nodeValue);
alert(t.childNodes(i).childNodes[1].firstChild.checked); 
}
}

</script>

<table id="tb">
<tr>
<td style="width: 122px">
1234</td>
<td style="width: 89px">
<input type="checkbox" /></td>
<td style="width: 210px">
</td>
</tr>
<tr>
<td style="width: 122px; height: 21px">
2234</td>
<td style="width: 89px; height: 21px">
<input type="checkbox" checked="CHECKED" /></td>
<td style="width: 210px; height: 21px">
</td>
</tr>
<tr>
<td style="width: 122px">
3234</td>
<td style="width: 89px">
<input type="checkbox" /></td>
<td style="width: 210px">
</td>
</tr>
</table>
</body>
</html>
Javascript 相关文章推荐
javascript获取url上某个参数的方法
Nov 08 Javascript
js数组与字符串的相互转换方法
Jul 09 Javascript
JavaScript 事件对象介绍
Apr 13 Javascript
Javascript中匿名函数的调用与写法实例详解(多种)
Jan 26 Javascript
js+css实现回到顶部按钮(back to top)
Mar 02 Javascript
js 判断各种数据类型的简单方法(推荐)
Aug 29 Javascript
浅谈jQuery before和insertBefore的区别
Dec 04 Javascript
那些精彩的JavaScript代码片段
Jan 12 Javascript
浅谈Angular HttpClient简单入门
May 04 Javascript
基于Three.js实现360度全景图片
Dec 30 Javascript
微信小程序 wepy框架与iview-weapp的用法详解
Apr 10 Javascript
详解使用WebPack搭建React开发环境
Aug 06 Javascript
Javascript遍历table中的元素示例代码
Jul 08 #Javascript
JavaScript遍历table表格中的某行某列并打印其值
Jul 08 #Javascript
一个简单的全屏图片上下打开显示网页效果示例
Jul 08 #Javascript
JavaScript通过元素的ID和name设置样式
Jul 08 #Javascript
jquery中each方法示例和常用选择器
Jul 08 #Javascript
使用jQuery的attr方法来修改onclick值
Jul 07 #Javascript
bootstrap data与jquery .data
Jul 07 #Javascript
You might like
一个oracle+PHP的查询的例子
2006/10/09 PHP
PHPWind 发帖回帖Api PHP版打包下载
2010/02/08 PHP
php mysql 判断update之后是否更新了的方法
2012/01/10 PHP
用来解析.htpasswd文件的PHP类
2012/09/05 PHP
php使用websocket示例详解
2014/03/12 PHP
Yii2中如何使用modal弹窗(基本使用)
2016/05/30 PHP
laravel-admin自动生成模块,及相关基础配置方法
2019/10/08 PHP
PHP实现简单的协程任务调度demo示例
2020/02/01 PHP
JavaScript 作用域链解析
2014/11/13 Javascript
javascript实现单击和双击并存的方法
2014/12/13 Javascript
JS使用正则截取两个字符串之间的字符串实现方法详解
2017/01/06 Javascript
js实现前端分页页码管理
2017/01/06 Javascript
bootstrap中的 form表单属性role=&quot;form&quot;的作用详解
2017/01/20 Javascript
滚动条的监听与内容随着滚动条动态加载的实现
2017/02/08 Javascript
jQuery插件HighCharts实现的2D面积图效果示例【附demo源码下载】
2017/03/15 Javascript
让微信小程序支持ES6中Promise特性的方法详解
2017/06/13 Javascript
Vue中使用sass实现换肤功能
2018/09/07 Javascript
VUE 实现复制内容到剪贴板的两种方法
2019/04/24 Javascript
微信小程序可滑动月日历组件使用详解
2019/10/21 Javascript
处理JavaScript值为undefined的7个小技巧
2020/07/28 Javascript
[01:08:09]DOTA2上海特级锦标赛主赛事日 - 1 胜者组第一轮#1Liquid VS Alliance第二局
2016/03/02 DOTA
[01:00:14]2018DOTA2亚洲邀请赛 4.6 淘汰赛 VP vs TNC 第三场
2018/04/10 DOTA
Python面向对象之继承和组合用法实例分析
2018/08/27 Python
python 初始化一个定长的数组实例
2019/12/02 Python
Python 之 Json序列化嵌套类方式
2020/02/27 Python
HTML5录音实践总结(Preact)
2020/05/07 HTML / CSS
员工自我鉴定范文
2013/10/06 职场文书
中专生职业生涯规划书范文
2014/01/10 职场文书
庆祝国庆节标语
2014/10/09 职场文书
婚前保证书范文
2015/02/28 职场文书
作弊检讨书范文
2015/05/06 职场文书
导游词之井冈山
2019/11/20 职场文书
PyQt5 QThread倒计时功能的实现代码
2021/04/02 Python
Python进度条的使用
2021/05/17 Python
python pygame 开发五子棋双人对弈
2022/05/02 Python
apache虚拟主机配置的三种方式(小结)
2022/07/23 Servers