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 学习初步 入门教程
Mar 25 Javascript
jquery 提交值不为空的元素示例代码
May 10 Javascript
浅谈JavaScript字符串拼接
Jun 25 Javascript
jQuery实现带有洗牌效果的动画分页实例
Aug 31 Javascript
jQuery ajaxSubmit 实现ajax提交表单局部刷新
Jul 04 Javascript
sea.js常用的api简易文档
Nov 15 Javascript
javascript中this关键字详解
Dec 12 Javascript
图解Javascript——作用域、作用域链、闭包
Mar 21 Javascript
JavaScript实现创建自定义对象的常用方式总结
Jul 09 Javascript
用Fundebug插件记录网络请求异常的方法
Feb 21 Javascript
json_decode 索引为数字时自动排序问题解决方法
Mar 28 Javascript
详解JavaScript 的执行机制
Sep 18 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
php中time()与$_SERVER[REQUEST_TIME]用法区别
2014/11/19 PHP
PHP版单点登陆实现方案的实例
2016/11/17 PHP
PHP的Trait机制原理与用法分析
2019/10/18 PHP
jquery 学习之二 属性(html()与html(val))
2010/11/25 Javascript
一个JavaScript用逗号分割字符串实例
2014/09/22 Javascript
简要了解jQuery移动web开发的响应式布局设计
2015/12/04 Javascript
jQuery中attr()与prop()函数用法实例详解(附用法区别)
2015/12/29 Javascript
JS判断图片是否加载完成方法汇总(最新版)
2016/05/13 Javascript
实例解析jQuery中proxy()函数的用法
2016/05/24 Javascript
bootstrap下拉菜单使用方法解析
2017/01/13 Javascript
微信小程序实战之自定义模态弹窗(8)
2017/04/18 Javascript
AngularJS日程表案例详解
2017/08/15 Javascript
jQuery实现简单的回到顶部totop功能示例
2017/10/16 jQuery
js与jQuery实现的用户注册协议倒计时功能实例【三种方法】
2017/11/09 jQuery
vue里的data要用return返回的原因浅析
2019/05/28 Javascript
jQuery实现动态加载(按需加载)javascript文件的方法分析
2019/05/31 jQuery
Vue中Table组件行内右键菜单实现方法(基于 vue + AntDesign)
2019/11/21 Javascript
vuex实现购物车功能
2020/06/28 Javascript
vue 项目中当访问路由不存在的时候默认访问404页面操作
2020/08/31 Javascript
[05:15]DOTA2英雄梦之声_第16期_灰烬之灵
2014/06/21 DOTA
python Django连接MySQL数据库做增删改查
2013/11/07 Python
Python 的 with 语句详解
2014/06/13 Python
Python中的with语句与上下文管理器学习总结
2016/06/28 Python
python使用RNN实现文本分类
2018/05/24 Python
pygame游戏之旅 添加键盘按键的方法
2018/11/20 Python
python中的垃圾回收(GC)机制
2020/09/21 Python
python openCV自制绘画板
2020/10/27 Python
英国团购网站:Groupon英国
2017/11/28 全球购物
英国领先的电子、技术和办公用品购物网站:Ebuyer
2018/04/04 全球购物
俄罗斯三星品牌商店:GalaxyStore
2020/11/04 全球购物
要账委托书范本
2014/09/15 职场文书
酒会开场白大全
2015/06/01 职场文书
葬礼主持词
2015/07/02 职场文书
宣传稿格式范文
2015/07/23 职场文书
盘点2020年适合农村地区创业的项目
2019/10/16 职场文书
教你怎么用Python监控愉客行车程
2021/04/29 Python