使用 jQuery 通过索引获取 td

问题描述 投票:0回答:4

我知道如何使用 jQuery 获取单元格的行和列索引,但我无法弄清楚相反的情况。给定行和列索引,我将如何访问该位置的 td?

javascript jquery html indexing html-table
4个回答
101
投票

使用纯 JavaScript:

// table is a reference to your table
table.rows[rowIndex].cells[columnIndex]

参考:

HTMLTableElement
,
HTMLTableRowElement


使用 jQuery,您可以使用

.eq()
:

$('#table tr').eq(rowIndex).find('td').eq(columnIndex)
// or
$('#table tr:eq(' + rowIndex + ') td:eq(' + columnIndex + ')')

12
投票

使用

nth-child
选择器怎么样?

http://api.jquery.com/nth-child-selector/

var row = 4;
var col = 2

var cell = $('table#tableId tr:nth-child(' + row + ') td:nth-child(' + col + ')');

请注意,子索引是从 1 开始的,而不是更常见的从 0 开始。


0
投票

您可以使用

:eq
选择器:

var row = 1;
var col = 2;
var cell = $('table tr:eq(' + row + ') td:eq(' + col + ')');

这是一个 实际例子


0
投票

这是一个纯 JavaScript 示例。请参阅 HTML 底部的脚本。

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <!-- [Getting td by index with jQuery (N.B. also tagged javascript)](https://stackoverflow.com/questions/6139407/getting-td-by-index-with-jquery) 
  used table from [javascript: getting td index [duplicate]](https://stackoverflow.com/questions/6470877/javascript-getting-td-index)
  -->
  <table>
    <thead>
      <tr><th>1</th> <th>2</th> <th>3</th></tr>
    </thead>
  
    <tbody>
      <tr><td onclick="showIx(this)">data</td> <td onclick="showIx(this)">checkbox</td> <td onclick="showIx(this)">data</td></tr>
    </tbody>
  </table>


</body>
<script>
  function showIx(myTDobj){
    /** 
     * see [cellIndex >> HTMLTableCellElement - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/HTMLTableCellElement)
     */
    alert(myTDobj.cellIndex);
  }
</script>

</html>

爱与和平,

© www.soinside.com 2019 - 2024. All rights reserved.