javascript中特定childnode的数组

问题描述

var fieldsettags = document.getElementsByTagName('fieldset');
textareatags = new Array();
internalarray = new Array();
for (var x = 0; x < fieldsettags.length; x++) {
  for (var y = 0; y < fieldsettags[x].childNodes.length; y++) {
    if (fieldsettags[x].getElementsByTagName('textarea')[y]) {
      internalarray.push(fieldsettags[x].getElementsByTagName('textarea')[y]);
    }
  }
  textareatags.push(internalarray);
  internalarray = [];
}

<fieldset>
  <legend>something</legend><textarea>something</textarea><span>somethings</span>
  <div>something</div>
  <legend>something</legend><textarea>something</textarea><span>somethings</span>
  <div>something</div>
  <legend>something</legend><textarea>something</textarea><span>somethings</span>
  <div>something</div>
  <legend>something</legend><textarea>something</textarea><span>somethings</span>
  <div>something</div>
  <legend>something</legend><textarea>something</textarea><span>somethings</span>
  <div>something</div>
  <legend>something</legend><textarea>something</textarea><span>somethings</span>
  <div>something</div>
</fieldset>

我的文档中有很多fieldset标签，这里仅是一个例子，可以激发想象力。我想在数组中只有textarea元素。我要去哪里错了？记住每个字段集标记内的顺序和编号。的元素也不同。您是否建议任何其他获取方法？

解决方法

将看到的每个fieldset散布到一个数组中，然后将该数组映射到它的每个textarea后代：

const textareatags = [...document.querySelectorAll('fieldset')]
  .map(fieldset => [...fieldset.querySelectorAll('textarea')]);
console.log(textareatags);

<fieldset>
  <legend>something</legend><textarea>something</textarea><span>somethings</span>
  <div>something</div>
  <legend>something</legend><textarea>something</textarea><span>somethings</span>
  <div>something</div>
  <legend>something</legend><textarea>something</textarea><span>somethings</span>
  <div>something</div>
  <legend>something</legend><textarea>something</textarea><span>somethings</span>
  <div>something</div>
  <legend>something</legend><textarea>something</textarea><span>somethings</span>
  <div>something</div>
  <legend>something</legend><textarea>something</textarea><span>somethings</span>
  <div>something</div>



</fieldset>

,

您可能想要这样的东西：

const fieldSets= [...document.querySelectorAll('fieldset')];
const finalArray = [];

fieldSets.forEach((fieldSet) => {
    const textAreas = [...fieldSet.querySelectorAll('textarea')];
    finalArray.push(textAreas)
});
console.log(finalArray);