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 相关文章推荐
jquery 事件执行检测代码
Dec 09 Javascript
类似php的js数组的in_array函数自定义方法
Dec 27 Javascript
node.js中的fs.readlink方法使用说明
Dec 17 Javascript
基于JavaScript实现定时跳转到指定页面
Jan 01 Javascript
JavaScript中Math对象的方法介绍
Jan 05 Javascript
vue实现简单的MVVM框架
Aug 05 Javascript
angular的输入和输出的使用方法
Sep 22 Javascript
JS实现的简单tab切换功能完整示例
Jun 20 Javascript
vue实现滑动到底部加载更多效果
Oct 27 Javascript
小程序开发之模态框组件封装
Apr 23 Javascript
javascript实现前端input密码输入强度验证
Jun 24 Javascript
vue 动态创建组件的两种方法
Dec 31 Vue.js
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
Terran兵种对照表
2020/03/14 星际争霸
php 文件上传系统手记
2009/10/26 PHP
Linux下将excel数据导入到mssql数据库中的方法
2010/02/08 PHP
php+mysql实现数据库随机重排实例
2014/10/17 PHP
PHP面向对象程序设计实例分析
2016/01/26 PHP
PHP校验15位和18位身份证号的类封装
2018/11/07 PHP
键盘 keycode的值 javascript时触发事件时很有用的要素
2009/11/02 Javascript
用nodejs访问ActiveX对象,以操作Access数据库为例。
2011/12/15 NodeJs
Jquery命名冲突解决的五种方案分享
2012/03/16 Javascript
给js文件传参数(详解)
2014/07/13 Javascript
node.js中的fs.truncateSync方法使用说明
2014/12/15 Javascript
jQuery仿淘宝网产品品牌隐藏与显示效果
2015/09/01 Javascript
Vue 仿QQ左滑删除组件功能
2018/03/12 Javascript
vue用递归组件写树形控件的实例代码
2018/07/19 Javascript
vuejs简单验证码功能完整示例
2019/01/08 Javascript
Element-ui自定义table表头、修改列标题样式、添加tooltip、:render-header使用
2019/04/11 Javascript
es6函数之尾调用优化实例分析
2020/04/25 Javascript
JavaScript常用进制转换及位运算实例解析
2020/10/14 Javascript
python实现简单的socket server实例
2015/04/29 Python
python通过ssh-powershell监控windows的方法
2015/06/02 Python
浅析python递归函数和河内塔问题
2017/04/18 Python
cookies应对python反爬虫知识点详解
2020/11/25 Python
通过HTML5 Canvas API绘制弧线和圆形的教程
2016/03/14 HTML / CSS
美国电视购物HSN官网:HSN
2016/09/07 全球购物
泰国国际航空公司官网:Thai Airways International
2019/12/04 全球购物
写自荐信有哪些不宜?
2013/10/17 职场文书
函授毕业生的自我鉴定
2013/11/26 职场文书
岗位职责说明书
2014/05/07 职场文书
项目建议书范文
2014/05/12 职场文书
演讲比赛策划方案
2014/06/11 职场文书
护理目标管理责任书
2014/07/25 职场文书
2014年9.18纪念日演讲稿
2014/09/14 职场文书
大学生职业生涯规划大赛作品(精品)
2014/09/17 职场文书
县委班子四风对照检查材料思想汇报
2014/09/29 职场文书
大学感恩节活动策划方案
2014/10/11 职场文书
小学班主任教育随笔
2015/08/15 职场文书