如何从此 NodeList 中提取数据？

Question

我需要从 NodeList 中提取特定数据属性。一般来说，我从数组或对象中获取数据没有问题，但是这个 NodeList 超出了我的范围！用Array.from()转数组也不行

这是相关代码：

这是它记录的内容：

在第 173 行的日志中，封闭数组包含我需要的所有数据，但我只是不明白如何去那里。当我尝试转到那里的索引时，它只会打开路径坐标。

我还会将代码图像添加为文本，但它没有任何行：

let test = d3.selectAll(".unit")
    console.log(test)
    console.log(test._groups)
    console.log(test._groups[0])
    console.log(test._groups[0][0])

编辑：更具体地说，我需要的数据是节点列表（？）下方数组内的“data”属性，与之前的比较第 173 行日志的图像：

EDIT2：更清楚一点：当我在控制台中打开节点列表时，我也得到了一个数组，我只对这个数组感兴趣。我不明白这个数据结构，数组与节点列表有什么关系，但我尝试了多种方式访问数组的索引，但没有任何效果。

Answer 1

NodeList 对象是节点的集合。在某些情况下，NodeList 是 live，这意味着 DOM 中的更改会自动更新集合。在其他情况下，NodeList 是 static，其中 DOM 中的任何更改都不会影响集合的内容。 document.querySelectorAll() 方法 returns 静态 NodeList，例如。

可以使用 for 循环遍历 NodeList 中的项目：

for (let i = 0; i < myNodeList.length; i++) {
  let item = myNodeList[i];
}

for...of 循环将正确地遍历 NodeList 对象：

const list = document.querySelectorAll('input[type=checkbox]');
for (let checkbox of list) {
  checkbox.checked = true;
}

您可以使用 item() 方法通过索引获取项目。例如，这就是您如何在某个页面上获得第一个 <div> 的 id：

document.querySelectorAll("div").item(0).id

在你的例子中，你有一个数组，它包含一个 NodeList 类型的元素。所以，当你执行 test._groups[0] 时，你会得到数组的第一个元素，这个元素是 NodeList ，你需要像使用 NodeList 一样使用它（见上文）！例如：

const arr = [1,2]; // simple array
// arr[0] is 1.
// in your case you have an array, but elements in that array are of type NodeList 
// (that's why console shows something like [NodeList(...)])

// when you get something from your array - it will be NodeList
// hence you can iterate over it or get some particular item like
test._groups[0].item(0).ariaAtomic

还有很多有用的方法。查看 docs 了解更多详情。

Answer 2

要从 nodeList 中提取数据，您必须循环您的节点列表和其他选项卡中的库存 nodList 元素

var list = node.childNodes; 

// Using for..of 
for(var value of list.values()) { 
  console.log(value); 
}

[check this link https://developer.mozilla.org/en-US/docs/Web/API/NodeList/values][1]

Answer 3

NodeList 对象是节点的集合。

您可以使用 NodeList.length 属性循环遍历节点列表并读取它的 innerHTML，如下所示。

并参考文档以获取更多知识

var items = document.getElementsByTagName("p");

var gross = "";
for (var i = 0; i < items.length; i++) {
   gross += items[i].innerHTML;
}

你还可以循环遍历

如何从此 NodeList 中提取数据？

How do I extract data from this NodeList?

javascript

nodelist