【转】getElementById()、getElementsByName()、getElementsByTagName()的用法和获得表格中的记录数

本文介绍如何使用JavaScript通过getElementById和getElementsByTagName方法获取HTML表格中的行数、列数及具体单元格数据,并提供了去除表头后的记录计数方法。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

  1. getElementById():返回拥用传递给该方法的指定id的第一个对象的引用。
  2. getElementsByName():返回拥用传递该方法的指定name的对象集合。
  3. getElementsByTagName():返回拥用传递给该方法的指定tag名称的对象集合。

如果在页面上有一个表格,

功能描述:获得记录数:

Js代码
  1. //要把表头去掉。   
  2. function getReorderCount(){   
  3.   var reocrders = document.getElementsByTagName("tr");   
  4.   return reocrders.length -1;   
  5. }  

也可以这样写:

 

Js代码
  1. var  table = document.getElementById("table1");   
  2. //这是表格的行数   
  3. table.rows.length;   
  4. //如查要获得数据的记录数要把表头给去掉。要减1.  

表格有rows与cells属性。其特点与getElementByTagName一样

getElementByTagName是文档接口(Document interface)和元素接口(Element interface)的中的方法,所以不管是根文档对象还是所有的元素对象都含有方法getElementByTagName();

功能描述:获得表格的列数

Js代码
  1. function getColumnCount(){   
  2.    var reocrders = document.getElementsByTagName("tr");   
  3.     return reocrders.item(0).childNodes.length   
  4. }  

功能描述:获得除表头表格中元素的数据

Js代码
  1. function getCellData(){   
  2.    reocrders = document.getElementsByTagName("tr");   
  3.    for(j=1;j<reocrders.length;j++){   
  4.        currentRow =  reocrders.item(j) ;   
  5.        cur_cells = currentRow.getElementsByTagName("td");      
  6.        for(i=0;i<cur_cells.length;i++){   
  7.             alert(cur_cells.item(i).childNodes.item(0).data);   
  8.        }   
  9.    }   
  10. }  

 其中一个td单元中的数据也是一个结点对象,即文字结点

 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值