如何在JavaScript中获取具有特定属性的所有子元素

如何将节点“强制转换”到元素?

你不能。

元素是节点的子集。

如果它还不是元素,那么就不能将其转换为元素。

考虑:

<div>Hello, <strong>World</strong></div>

您有两个子节点。文本节点 "Hello, " 和强元素节点。

治疗没有意义 “您好,” 作为一个元素。

考虑使用 children 而不是 childNodes . 它只能获取 要素 儿童

我需要获取所有具有特定属性的子元素

在这种情况下,您最好只使用一个选择器,这样您就可以在第一时间得到它。除了现有的选择器之外,还需要一个子组合器和一个属性选择器。那么你需要使用 All 要获得多个结果:

document.querySelectorAll("...my selector... > [someAttribute]"

您说过要选择具有特定属性的所有子级。因此,使用属性选择器使用querySelectorAll选择它们。

var elems = document.querySelectorAll("#theParentSelector > [theChildsAttribute]")
console.log(elems.length)
Array.from(elems).forEach( function (el) {
   console.log(el.getAttribute("theChildsAttribute"))
});

<div id="theParentSelector">
  <div theChildsAttribute="1">Foo 1</div>
  <div>Bar</div>
  <div theChildsAttribute="2">Foo 2</div>
  <div theChildsAttribute="3">Foo 3</div>
</div>

你会使用 children 要访问所有基于HTML的节点,请执行以下操作:

document.querySelector("...my selector...").children