javascript - 如何从此 NodeList 中提取数据？

问题描述

我需要从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])

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

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

标签： javascriptnodelist

NodeList对象是节点的集合。在某些情况下，它NodeList是live的，这意味着 DOM 中的更改会自动更新集合。在其他情况下，它NodeList是静态的，DOM 中的任何更改都不会影响集合的内容。例如，该document.querySelectorAll()方法返回一个 static 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()方法通过其索引获取项目。例如，这是您可以在某些页面上获取id第一个的方式：<div>

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

在您的情况下，您有一个数组，它包含一个 type 的元素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

还有很多有用的方法。检查文档以获取更多详细信息。

javascript - 如何从此 NodeList 中提取数据？

问题描述

解决方案

推荐阅读