javascript - 使用 nextSibling 从 HTML 表格中检索数据

Question

我有两个 HTML 表格:

<tr>
    <td width="319" align="right" bgcolor="#F5F5F5" class="txtdarkgreybold">Article title:</td>
    <td width="346" align="left" bgcolor="#F5F5F5">My title</td>
</tr>
<tr>
    <td align="right" class="txtdarkgreybold">Author:</td>
    <td align="left"><a href="/index.php?action=search&amp;name1=Przylipiak Mirosław&amp;results=10">Doe John</a><br /></td>
</tr>

通过使用 document.getElementsByClassName("txtdarkgreybold") 我可以检索字符串 Article title: 但我对它后面的内容感兴趣，即: 我的标题。我该怎么做呢？在第二个表中，我可以得到作者:，但我对Doe John感兴趣。我正在考虑将 nextSibling 作为获取我可以获得的字符串之后的字符串的一种方式，但我无法自己实现它。

Answer 1

您可以使用nextElementSibling 与 textContent :

document.querySelector('.txtdarkgreybold').nextElementSibling.textContent

希望这有帮助。

console.log( document.querySelectorAll('.txtdarkgreybold')[0].nextElementSibling.textContent );

console.log( document.querySelectorAll('.txtdarkgreybold')[1].nextElementSibling.textContent );

<table>
  <tr>
    <td width="319" align="right" bgcolor="#F5F5F5" class="txtdarkgreybold">Article title:</td>
    <td width="346" align="left" bgcolor="#F5F5F5">My title</td>
  </tr>
  <tr>
    <td align="right" class="txtdarkgreybold">Author:</td>
    <td align="left"><a href="/index.php?action=search&amp;name1=Przylipiak Mirosław&amp;results=10">Doe John</a><br /></td>
  </tr>
</table>