对getElementsByClassName / querySelectorAll结果的元素访问

Question

我正在尝试通过getElementsByClassName / querySelectorAll函数访问我的元素，但我不明白当我尝试从结果中获取元素时会发生什么。

var cells = document.getElementsByClassName('mapAtt');
console.log(cells); // [item: function]
console.log(cells[0]);  //  undefined
console.log(cells.item(0)); //  none
console.log(cells.length);  //  0

var cells2 = document.querySelectorAll(".mapAtt");
console.log(cells2);    // [item: function]
console.log(cells2[0]); //  undefined
console.log(cells2.item(0));    //  none
console.log(cells2.length); //  0

我读到这两个函数的返回不是数组而是nodeList，但即使使用item函数，它也不起作用。

cells1和cells2向我展示了正确的东西，一个包含22个元素的列表，但我无法使用array / nodeList方法访问它们。

使用d3.js创建元素，但如果我不说错误，则应该创建骨架良好的HTML DOM元素。那为什么不起作用？