當(dāng)前位置:軟件學(xué)堂 > 資訊首頁 > 網(wǎng)絡(luò)編程 > 編程其他 > JavaScript遍歷table的行和列

JavaScript遍歷table的行和列

2012/10/30 13:38:41作者:佚名來源:網(wǎng)絡(luò)

移動端

【實例名稱】

JavaScript遍歷table的行和列

【實例描述】

table是網(wǎng)頁中常用的布局方式。本例學(xué)習(xí)如何使用JavaScript處理table中的行和列。

【實例代碼】

<HTML> <head> <SCRIPT LANGUAGE="JavaScript"> //遍歷表格的每行每列 function viewCell() {     var count=1;                                                    //在表格中顯示的內(nèi)容     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;    //在單元格顯示數(shù)值             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中列和行的表示方法?!皉ows”和“cells”別表示表格的行和列,如果要獲取行數(shù)使用“rows.length”,獲取列數(shù)使用“cells.length”。

【源碼下載】

如果你不愿復(fù)制代碼及提高代碼準(zhǔn)確性,你可以點擊:JavaScript遍歷table的行和列 進行本實例源碼下載 

標(biāo)簽: JS代碼  JavaScript  table