是否可以在 NodeList 中定位兄弟节点？ 如果是这样，如何

Question

I'm trying to target siblings in a nodeList, the same way that jquery does with.siblings()? I have a bunch of form fields with the class name of "js-form-control"

<div class="form-group col-md-6  ">
  <input type="text" name="ctrl_name" id="ctrl_name" 
         class="form-control js-form-control"
         placeholder="Entrez votre nom*">
</div>
<div class="form-group col-md-6">
  <input type="email" name="ctrl_email" id="ctrl_email" 
         class="form-control js-form-control"
         placeholder="Entrez votre e-mail*">
</div>
<div class="form-group col-md-12">
  <textarea name="ctrl_message" id="ctrl_message" 
            class="form-control js-form-control"
            placeholder="Entrez votre message*">
  </textarea>
</div>
<div class="col-md-12 text-center">
  <button disabled class="btn btn-primary textcenter" id="ctrl_button">Envoyer</button>
</div>

in my js file i have querySelectorAll that builds a NodeList.

const allFields = document.querySelectorAll('.js-form-control');

I iterate over allFields to add an event handler on each child:

for ( var entry of allFields.entries() ) {

  console.log(entry);

  entry.addEventListener('change', e => {

    if (e.target.value != "" && entry[1].value != "" && entry[2].value != "") {
      targetButton.disabled = false;
    } else {
       targetButton.disabled = true;
    }
  })
}

How do i target the siblings in order to check if their values are empty? Thanks. For exemple, if i'm in entry 0, i want to check if all other entries's values are empty...

Answer 1

First check that the element has child nodes

 // div is an object reference to a <div> element as an example

  if (div.hasChildNodes()) {
    let children = div.childNodes;

    for (let i = 0; i < children.length; i++) {
      // register event handler with each child as children[i] here

    }
  }