js獲取表格指定行中所有的單元格

admin發表於2017-03-24

本章節介紹一下如何獲取一個table表格中指定行下面的所有單元格,非常的簡單,直接看程式碼.

程式碼例項:

[HTML] 純文字檢視 複製程式碼
<!DOCTYPE html>  
<html>  
<head>  
<meta charset=" utf-8">  
<meta name="author" content="http://www.softwhy.com/" />  
<title>螞蟻部落</title>  
<style type="text/css"> 
.table{ 
  width:300px; 
  height:100px; 
  border:1px solid #ccc; 
  border-collapse:collapse; 
} 
.table td,.table th { 
  border:1px solid #ccc; 
  padding:5px; 
} 
</style> 
<script type="text/javascript"> 
window.onload=function(){
  var oshow=document.getElementById("show");
  var otable=document.getElementById("tb");
  oshow.innerHTML=otable.rows[1].cells.length;
}
</script>
</head> 
<body> 
<div id="show"></div>
<table id="tb" class="table"> 
  <thead> 
    <tr> 
      <th>螞蟻部落一</th> 
      <th>螞蟻部落二</th> 
    </tr> 
  </thead> 
  <tr> 
    <td>javascript教程</td> 
    <td>jQuery教程</td> 
  </tr> 
  <tr> 
    <td>HTML教程</td> 
    <td>div css教程</td> 
  </tr> 
</table> 
</body> 
</html>

以上程式碼可以獲取第二行所有單元格的數目,下面做一下介紹:

[JavaScript] 純文字檢視 複製程式碼
otable.row

以上程式碼可以獲取表格中所有的行。

[JavaScript] 純文字檢視 複製程式碼
rowObj.cells

以上程式碼可以獲取指定行中的所有單元格。

相關文章