使用 JavaScript 在 DOM 中查找下一个同级元素

Question

如何找到当前作用域中的下一个元素？例如，我想找到 div 元素，然后是下一个 p?

如果我使用 document.getElementsByTagName('DIV')[0].nextSibling 它 returns #text。我想要 return p 标签。

<div>
    <table>
        <tr>
            <td></td>
        </tr>
    </table>
</div>
<p></p>

Answer 1

您可以使用 nextElementSibling。如果需要支持旧版浏览器，遍历nextSibling直到找到Element节点。

Answer 2

document.getElementsByTagName('DIV')[0].nextElementSibling

你得到 #text 的原因是因为 nextSibling 将 return 是父元素的 childNodes 列表中的下一个节点。在这种情况下，它是空格（因此是#text），因为在 </div> 和 <p>.

之间使用了换行符

Find Next Sibling Element In DOM With JavaScript