如何在 JavaScript 中选择下一个元素

在 JavaScript 中，可以使用多种方法来选择下一个元素。以下是一些常见的方法：

nextSibling 属性

nextSibling 属性返回当前元素的下一个兄弟节点，在 DOM 树中，兄弟节点是指与当前节点具有相同父节点的其他节点。

let currElement = document.getElementById('curr-id');
let nextElement = currElement.nextSibling;

需要注意的是，nextSibling 返回的节点类型可能是文本节点、注释节点或元素节点，因此在使用时需要注意节点类型的判断。

nextElementSibling 属性

nextElementSibling 属性与 nextSibling 类似，但是只返回下一个元素节点。

let currElement = document.getElementById('curr-id');
let nextElement = currElement.nextElementSibling;

querySelector 方法

querySelector 方法可以选择指定 CSS 选择器的第一个元素，如果需要选择下一个元素，可以通过指定相应的 CSS 选择器来实现。

let currElement = document.getElementById('curr-id');
let nextElement = currElement.querySelector('+ selector');

需要注意的是，querySelector 方法只会返回第一个匹配的元素，因此如果需要选择所有匹配的元素，需要使用 querySelectorAll 方法。

使用 jQuery

如果使用 jQuery 库，可以轻松地选择下一个元素。

let currElement = $('#curr-id');
let nextElement = currElement.next();

需要注意的是，如果需要选择符合指定 CSS 选择器的下一个元素，可以使用 nextAll 方法。

let currElement = $('#curr-id');
let nextElement = currElement.nextAll('.selector').first();

以上是几种常见的选择下一个元素的方法，需要根据实际场景选择适合的方法。