如何在vanilla javascript中以兄弟姐妹为目标？

我正在创建一个切换审阅表单，当您点击编辑时会显示该表单，但我只希望该表单在审阅按钮的同级上工作，而不是页面上的所有审阅编辑表单（因为可能有多个）

我知道如何在jquery中做到这一点，但我试图让这个项目保持所有的风格

const button = document.querySelector('.toggle-edit-form');
const form = document.querySelector('.edit-review-form');
button.onclick = function() {
  // toggle the edit button text on click
  button.innerHTML === 'Edit' ? button.innerHTML = "Cancel" : button.innerHTML = "Edit";
  // toggle visibility of edit review form
  form.classList.toggle('toggle')
};

我想我可以使用nextSibling（因为它目前是下一个兄弟），但我更喜欢一个在更改order/html时不会破坏代码的解决方案

---

谢谢

@Mike您可以尝试创建一个使用while循环跟踪兄弟姐妹的函数，我希望这会有所帮助

var getSiblings = function (elem) {

    // Setup siblings array and get the first sibling
    var siblings = [];
    var sibling = elem.parentNode.firstChild;

    // Loop through each sibling and push to the array
    while (sibling) {
        if (sibling.nodeType === 1 && sibling !== elem) {
            siblings.push(sibling);
        }
        sibling = sibling.nextSibling
    }

    return siblings;

};

---

添加相关标记“我可以使用

nextSibling

…但更喜欢在更改顺序/html时不会破坏代码的解决方案。”-要么是同级，然后使用

.nextSibling

或更好的

.nextementsibling

，要么不再是同级。@Andreas相关标记是什么？在jquery中，同级是节点下的所有元素。但在这里，它可能不一定是下一个兄弟，所以我想要的代码可以以它为目标，而不管它是否是下一个。让我们重新调整它的阶段：到目前为止，您自己尝试了什么来解决这个问题？如果您已经知道

.nextSibling

（以及它的工作原理，提示：

while

），那么获得预期的结果应该不难。谢谢@Andreas，恐怕我还不太了解它。我尝试了一个while语句，但我无法找到我的应用程序的底部。