文章导航

JavaScript rows 属性

2018-10-24 11:18| 作者: admin| 查看: 1629| 评论: 0|来自: 蚂蚁部落

rows可以获取表格中所有行的集合。

利用集合的length属性可以获取具体的行数。

语法结构:

[JavaScript] 纯文本查看 复制代码
tableObject.rows

浏览器支持:

(1).IE浏览器支持此属性。

(2).edge浏览器支持此属性。

(3).谷歌浏览器支持此属性。

(4).opera浏览器支持此属性。

(5).火狐浏览器支持此属性。

(6).safria浏览器支持此属性。

代码实例:

[HTML] 纯文本查看 复制代码运行代码
<!DOCTYPE html> 
<html> 
<head> 
<meta charset=" utf-8"> 
<meta name="author" content="http://www.softwhy.com/" /> 
<title>蚂蚁部落</title> 
<style>
ul li{
  list-style: none;
}    
</style>    
<script>  
window.onload=function() {
  let otable=document.getElementById("thetable");
  let otrnum=document.getElementById("trnum");
  let obt=document.getElementById("trbt");
  trbt.onclick=function() {
    let rows=otable.rows;
    otrnum.innerHTML="表格中行的数量是:"+rows.length;
  }
}
</script> 
</head> 
<body> 
<table id="thetable" border="1"> 
  <tr> 
    <td>序号</td> 
    <td>教程</td> 
    <td>作者</td> 
  </tr> 
  <tr> 
    <td>1</td> 
    <td>JavaScript教程</td> 
    <td>antzone</td> 
  </tr> 
  <tr> 
    <td>2</td> 
    <td>div css教程</td> 
    <td>蚂蚁部落</td> 
  </tr> 
</table> 
<ul> 
  <li id="trnum"></li> 
  <li><input type="button" id="trbt" value="获取行的数量"/></li> 
</ul> 
</body> 
</html>

上述代码点击按钮可以获取table表格中具体的函数。


鲜花

握手

雷人

路过

鸡蛋

最新评论

返回顶部