Question

我正在使用传单和d3.js制作大量的SVG元素。我有一个传单地图，下面有一些div，然后是一个脚本元素，我正在填充传单地图，从.json文件添加数据，然后尝试将事件侦听器绑定到下面添加和删除的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和传单javascript之下。

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

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

Answer 1

解决了我自己的问题：

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

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

1 个答案: