在Javascript中访问单元格文本

当只有

元素有ID时，我试图更改表格单元格的文本，但单元格上没有设置ID，例如

<table id="test">
  <tbody>
    <tr>
      <td>Cell 1</td>
      <td>Cell 2</td>
    </tr>
  </tbody>
</table>

第1单元
第2单元

那么，如何在Javascript中更改第二个单元格（单元格2）的文本而不显式地为其指定ID呢

谢谢

AJ

使用，此任务将简单如下：

$('#test td:first').text('Your new text goes here');

我强烈推荐jQuery。您可能还会收到推荐jQuery的其他响应。

使用，此任务将简单如下：

$('#test td:first').text('Your new text goes here');

---

我强烈推荐jQuery。您可能还会收到推荐jQuery的其他响应。

使用jQuery确实很容易，但我假设您希望使用本机DOM方法。那么,

document.getElementById('test').getElementsByTagName('td')[1]

将带您到该表格中的第二个表格单元格

---

使用jQuery确实很容易，但我假设您希望使用本机DOM方法。那么,

document.getElementById('test').getElementsByTagName('td')[1]

将带您到该表格中的第二个表格单元格

---

类似的方法应该会奏效：

document.getElementById('test').childNodes[1].childNodes[1].childNodes[3].innerHTML='changed cell';

---

类似的方法应该会奏效：

document.getElementById('test').childNodes[1].childNodes[1].childNodes[3].innerHTML='changed cell';

---

对我来说，最明显的方法是按照以下代码执行：

document.getElementById("test").rows[0].cells[1].innerHTML = "Cell not so 2."

如果要处理大量数据，不要使用JQuery，因为它很慢

---

您可以看看JQuery处理和本机DOM之间的区别（如果您阅读该文章中的链接，页面上会有一个图表，显示差异有多大）。

对我来说，最明显的方法是按照下面的代码进行操作：

document.getElementById("test").rows[0].cells[1].innerHTML = "Cell not so 2."

如果要处理大量数据，不要使用JQuery，因为它很慢

---

您可以查看JQuery处理和本机DOM之间的差异（如果您遵循该帖子中的链接，页面上有一个图表，显示差异有多大）。

您可以使用纯JS完成这项工作，代码如下：

document.querySelector('#test td:nth-child(2)').innerHTML = 'value changed';

浏览器对此的支持非常好：

编辑

---

不幸的是，@Matt Ball的代码速度更快，正如您在这里看到的：。

您可以使用纯JS使用以下代码：

document.querySelector('#test td:nth-child(2)').innerHTML = 'value changed';

浏览器对此的支持非常好：

编辑

---

不幸的是，@Matt Ball的代码更快，正如您在这里看到的：。

Drew，OP说的是第二个，而不是第一个。哎哟，错过了。在这种情况下，选择器将是：“#test td:eq（1）”Drew，OP说的是第二个，而不是第一个。哎哟，没听到。在这种情况下，选择器将是：“#test td:eq（1）”没问题。我仍然建议使用jQuery，因为它使您的代码更加简洁，减少了样板文件，而且只会使编写Javascript的过程更简单。它的性能比我自己的aproach要好得多。谢谢，没问题。我仍然建议使用jQuery，因为它使您的代码更加简洁，减少了样板文件，而且只会使编写Javascript的过程更简单。它的性能比我自己的aproach要好得多。谢谢