Javascript:getAttribute()返回对象NodeList?

所以我要做的是根据HTML“id”属性的值显示一系列图像,这也是图像文件的名称。我已经编写了一个Javascript代码 src 系列中每个图像的url(忽略愚蠢的类名):

var idnum = document.querySelectorAll(".trollface")[0].getAttribute("id");

var tribe;
if (idnum < 116903 && idnum > 100000) {
    tribe = "Xana";
} else if (idnum < 213403 && idnum > 200000) {
    tribe = "Hemi";
} else {
    tribe ="Theri";
} 

var icon = document.getElementsByClassName("trollface");
for(var i = 0; i < icon.length; i++) {
    icon[i].src = "Dot_files/" + tribe + "/Icons/" + idnum + ".png";
}

这很好,但是正如你所看到的,所有的图像都是相同的 钢筋混凝土 这不是我想要的。

我遇到的主要问题是获取每个 img 的 id 属性并将其用于自己 img src 网址。

我已经尝试过 身份证件 的

var idnum = document.querySelectorAll(".trollface");
for(var x = 0; x < idnum.length; x++) {
    idnum[x].getAttribute("id");
}

但在Chrome中 idnum 是“[object%20NodeList]”,我认为它是一个对象NodeList。这又导致了ERR_FILE_NOT_FOUND(或类似的东西),因为输出url变成 Dot_files/Theri/Icons/[object%20NodeList].png ,不存在。

使用这个,我尝试将NodeList转换为数组,但在Chrome中仍然得到了相同的结果。

所以我想问的是: getAttribute("id") 当我用类遍历所有元素时不起作用 trollface ? 如果我只使用上面第一段代码中显示的一行代码,它就可以正常工作了。 也可以重复两次,就像我用 idnum公司 第二次与 icon 。这和我的问题有什么关系吗?

是否有解决方法?我已经干了几天了,不知道该怎么做。

谢谢你的帮助,很抱歉发了这么长的帖子。如果需要,我可以提供更多细节/解释。