获取table中的rowIndex和cellIndex

时间：2021-05-18 09:48:51|栏目：JavaScript代码|点击：次

在IECN里有朋友问起怎么获取表格中某个单元格的行号与列号，可以用rowIndex和cellIndex来获取．
具体效果请看下面的代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  <html xmlns="http://www.w3.org/1999/xhtml" lang="gb2312">  <head>  <title> 获取table中的rowIndex和cellIndex </title>  <meta http-equiv="content-type" content="text/html; charset=gb2312" />  <meta name="generator" content="editplus" />  <meta name="author" content="枫岩,cnlei.y.l@gmail.com" />  <meta name="keywords" content="rowIndex,cellIndex" />  <script type="text/javascript">  onload = function() {   if (!document.getElementsByTagName || !document.createTextNode) return;   var rows = document.getElementById('MyTable').getElementsByTagName('tbody')[0].getElementsByTagName('tr');    var cols;   for (i = 0; i < rows.length; i++) {   rows[i].onclick = function() {   alert("行:"+eval(this.rowIndex + 1));   }      cols = rows[i].getElementsByTagName('td');      for (j = 0; j < cols.length; j++){   cols[j].onclick = function() {   alert("列:"+eval(this.cellIndex + 1));   }      }   }  }  </script>  </head>  <body>  <table id="MyTable" border="1">  <tbody>   <tr><td>行1列１</td><td>行1列２</td><td>行1列3</td></tr>   <tr><td>行2列１</td><td>行2列２</td><td>行2列3</td></tr>   <tr><td>行3列１</td><td>行3列２</td><td>行3列3</td></tr>  </tbody>  </table>  </body>  </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

上一篇：weebox弹出窗口不居中显示的解决方法

栏目：JavaScript代码

下一篇：Canvas放置反弹效果随机图形(实例)

本文标题：获取table中的rowIndex和cellIndex

本文地址：http://www.codeinn.net/misctech/124180.html

更多JavaScript代码

JavaScript代码

获取table中的rowIndex和cellIndex

阅读排行

推荐教程