当前位置:软件学堂 > 资讯首页 > 网络编程 > 编程其他 > JavaScript遍历table的行和列

JavaScript遍历table的行和列

2012/10/30 13:38:41作者:佚名来源:网络

移动端

【实例名称】

JavaScript遍历table的行和列

【实例描述】

table是网页中常用的布局方式。本例学习如何使用JavaScript处理table中的行和列。

【实例代码】

<HTML> <head> <SCRIPT LANGUAGE="JavaScript"> //遍历表格的每行每列 function viewCell() {     var count=1;                                                    //在表格中显示的内容     for (i=0; i < document.all.tbl.rows.length; i++) {              //遍历每行         for (j=0; j < document.all.tbl.rows(i).cells.length; j++) { //遍历行中的每一列             document.all.tbl.rows(i).cells(j).innerText = count;    //在单元格显示数值             count++;         }     } } </SCRIPT> </head> <BODY onload="viewCell()"> <TABLE id=tbl border=1 width="200"> <TR><TH>&nbsp;</TH><TH>&nbsp;</TH><TH>&nbsp;</TH><TH>&nbsp;</TH></TR> <TR><TD>&nbsp;</TD><TD>&nbsp;</TD><TD>&nbsp;</TD><TD>&nbsp;</TD></TR> <TR><TD>&nbsp;</TD><TD>&nbsp;</TD><TD>&nbsp;</TD><TD>&nbsp;</TD></TR> </TABLE> </BODY> </HTML>

【运行效果】

运行效果

【难点剖析】

本例的重点是table中列和行的表示方法。“rows”和“cells”别表示表格的行和列,如果要获取行数使用“rows.length”,获取列数使用“cells.length”。

【源码下载】

如果你不愿复制代码及提高代码准确性,你可以点击:JavaScript遍历table的行和列 进行本实例源码下载 

标签: JS代码