javascript - HTMLcollection 0 列表长度，[n]返回undefined，转换为数组返回空数组

Question

我正在使用 leaflet 和 d3.js 制作大量 SVG 元素。我有一个传单 map ，下面有一些 div，然后是一个脚本元素，我在其中填充传单 map ，从 .json 文件中添加数据，然后尝试将事件监听器绑定(bind)到添加和删除下面的 div svg 元素的类。在尝试构建 <path> 的集合时我已经制作了用于遍历它们并将类添加到它们的元素，但是对于我来说，我无法让 for 循环工作。

    var lowlightGisUnfiltered = document.getElementById(mapDivId).getElementsByClassName("gisData");
    console.log("unfiltered",lowlightGisUnfiltered, "length", lowlightGisUnfiltered.length);

    var transfer = lowlightGisUnfiltered;
    console.log("transfer:", transfer, "length:", transfer.length);

    var llarray = Array.prototype.slice.call(lowlightGisUnfiltered);
    console.log(llarray);

    console.log(lowlightGisUnfiltered[1]);
    console.log(transfer.item(1));

    var lowlightGIS = [];
    for(var n = 0; n < lowlightGisUnfilteredArray.length; n++){
        console.log("test");
        if(llarray[n].classList.contains(selectorClass)) {

            lowlightGIS.push(lowlightGisUnfiltered[n])
            }
    }

这个输出:

• 未过滤:[](一个包含 580 个元素的 HTML 集合，将最后的长度列为正确的长度)length:0
• transfer: [](一个580个元素的HTMLcollection，最后列出的长度是正确的长度)length:0
• [](空数组)
• 未定义
• 无

所有这些代码都在我制作动态标签的 d3 和 leaflet javascript 下面。

我检查了所有其他处理类似问题的 HTMLcollection 或 NodeList 问题，但没有找到解决方案。

编辑:我也试过 .querySelectorAll 但它只返回一个空数组。

Answer 1

解决了我自己的问题:

我没有意识到 d3.json 是异步的。我的代码在 d3.json 函数之外，所以显然我的数据实际上并未加载。