JavaScript获取table表格行与列的数量
分类：实例代码
JavaScript获取table表格行与列的数量属于前端实例代码，有关更多实例代码大家可以查看。
本章节介绍一下如何利用JavaScript获取一个表格的行和列的数目。
代码实例如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.pipipi.net/" />
<title>table细线表格-前端教程网</title>
<style type="text/css">
#thetable{
background-color:green;
font-size:12px;
}
#thetable th{
text-align:center;
background-color:#CCF;
height:30px;
line-height:30px;
}
#thetable td{
width:150px;
height:30px;
line-height:30px;
text-align:center;
background-color:#FFF;
}
</style>
<script type="text/javascript">
window.onload=function(){
var otable=document.getElementById("thetable");
var oshow=document.getElementById("show");
oshow.innerHTML="行的数目:"+otable.rows.length+"<br/>"
+"列的数目:"+otable.rows[0].cells.length;
}
</script>
</head>
<body>
<div id="show"></div>
<table cellpadding="0" cellspacing="1" id="thetable">
<tr>
<th>标题一</th>
<th>标题二</th>
<th>标题三</th>
<th>标题四</th>
</tr>
<tr>
<td>前端教程网一</td>
<td>前端教程网二</td>
<td>前端教程网三</td>
<td>前端教程网四</td>
</tr>
<tr>
<td>前端教程网一</td>
<td>前端教程网二</td>
<td>前端教程网三</td>
<td>前端教程网四</td>
</tr>
<tr>
<td>前端教程网一</td>
<td>前端教程网二</td>
<td>前端教程网三</td>
<td>前端教程网四</td>
</tr>
</table>
</body>
</html>
JavaScript获取table表格行与列的数量，这样的场景在实际项目中还是用的比较多的，关于JavaScript获取table表格行与列的数量就介绍到这了。