javascript 获取表格中元素id的实现代码

发布时间:2020-06-07编辑:脚本学堂
本文介绍下,用javascript获取表格中元素Id的方法,通过一个例子,帮助大家的理解。

代码如下:
 

复制代码 代码示例:
<html> 
 <head>
 <title>获取表格中元素id_www.jb200.com</title>
<script type="text/javascript" > 
 
function init(){  
 
var tab0=document.getElementById('tab0');  
 
var tr1=document.getElementById('tr1');  
 
var td3=document.getElementById('td3');  
 
var idx_tr1=tr1.rowIndex;  
 
var idx3= td3.cellIndex;  
 
alert( tab0.tBodies[0].rows[idx_tr1].id  + 'n'+ tr1.cells[idx3].id );  
 
}  
</script> 
 </head> 
 <body onload="init()"> 
  <table id="tab0" border="1" width="300"> 
  <tr id="tr0" style="display:none;"><td>.</td><td>.</td><td>.</td><td>.</td><td>.</td></tr> 
  <tr id="tr1"> 
<td id="td0">0</td> 
<td id="td1">1</td> 
<td id="td2" style="display:none;">2</td> 
<td id="td3">3</td> 
<td id="td4">4</td> 
  </tr> 
  </table> 
 </body> 
</html> 

 

运行后:
ie里提示 tr1 td2
ff safari opera下都提示 tr1 和 td3

总结:
在IE里 ,当table中有隐藏的td时,cellIndex这个属性不再可靠。
但是 当table中有隐藏的tr时,rowIndex这个属性依然是可靠的。

ie里对 td 隐藏后的,在计算 cellIndex时 会当作那个隐藏的td被移除了一样计算。
但是 tr的cells集合内却并没有移除那个隐藏的td。

为什么要出现这么多的浏览器呢,搞的我们好忙啊,哈哈!!!