0

参考这个例子:改变表格单元格内容

如果表格单元格超过 1 列且单元格中没有内容,如何更改表格单元格。

例如更改第 2 列中的第 3 个单元格?

<table width="200" border="1">
  <tr>
    <th scope="col">Daten 1</th>
    <th scope="col">Daten 2</th>
    <th scope="col">Daten 3</th>
  </tr>
  <tr>
    <td id="A1">1</td>
    <td id="B1">1</td>
    <td id="C1">&nbsp;</td>
  </tr>
  <tr>
    <td id="A2">2</td>
    <td id="B2">2</td>
    <td id="C2">&nbsp;</td>
  </tr>
  <tr>
    <td id="A3">3</td>
    <td id="B3">3</td>
    <td id="C3">&nbsp;</td>
  </tr>
  <tr>
    <td id="A4">4</td>
    <td id="B4">4</td>
    <td id="C4">&nbsp;</td>
  </tr>
</table>
4

4 回答 4

0

就像是,

jQuery(document).ready(function(){
    var t = document.getElementById('data');
    jQuery(t.rows[1].cells[2]).text('1st row last C'); 
    jQuery(t.rows[2].cells[2]).text('2nd row last C'); 

});

现场演示

于 2013-11-28T09:02:03.320 回答
0

您正在寻找:nth-child选择器。就像它所基于的 CSS 选择器一样,nth-child(i)采用基于 1 的索引。

$('table tr:nth-child(2) td:nth-child(3)').html('changed');

这是一个演示它的小提琴。

于 2013-11-28T08:49:02.703 回答
0

在第二列中选择第三个单元格,这意味着您必须先选择第三行,然后再选择第二列。在你的桌子上试试这个 jquery 选择器

$('#data tr:nth-child(3) td::nth-child(2))

甚至更好

$('#data').find('tr:nth-child(3)').find('td::nth-child(2)')

即使这可能不是获取表格单元格的最佳方式。

建议:如果可以根据每个表格单元格的索引给一些id,那么计算id和使用就很容易了$('#cellId_23')

每个单元格都有其唯一的 ID。例如: Cell(1,1) 可以有像 cell_11 这样的 id,而 Cell(1,2) 会有 cell_12 等等。

这将比上述两个选择器性能好得多。

于 2013-11-28T08:49:23.103 回答
0

您也可以使用 eq() 方法从 0 索引开始查找 td。

var value = $('#table_id').find("td").eq(5).html();

于 2013-11-28T08:52:27.927 回答