javascript - 定位兄弟元素的子元素

Question

以下代码以同级字段集为目标，以便在前一个代码中选择输入按钮时可以启用这些字段集:

document.querySelectorAll("fieldset").forEach(fieldset => {
  fieldset.addEventListener("change", function() {
    let nextFieldset = this.nextElementSibling

    while (nextFieldset && !nextFieldset.disabled) {
      nextFieldset = nextFieldset.nextElementSibling
    }

    if (nextFieldset) {
      nextFieldset.disabled = false
    }
  })
})

<小时/>

<form>
  <fieldset> … </fieldset>
  <fieldset> … </fieldset>
  <fieldset> … </fieldset>
</form>

How can I target fieldsets that are inside separate sections?

<form>
  <section><fieldset> … </fieldset></section>
  <section><fieldset> … </fieldset></section>
  <section><fieldset> … </fieldset></section>
</form>

Answer 1

这是完整的工作解决方案:

document.querySelectorAll("section").forEach(section => {
  section.addEventListener("change", function() {
    let nextFieldset = this.nextElementSibling.querySelector("fieldset")

    while (nextFieldset && !nextFieldset.disabled) {
      nextFieldset = nextFieldset.nextElementSibling
    }

    if (nextFieldset) {
      nextFieldset.disabled = false
    }
  })
})