Question

我有一个id为“productPriceContainer”的div，在这个div中有一个类“price”。我想访问“价格”类的innerHTML，因为我还有其他类叫“价格”。

我可以链接这样的东西吗？

document.getElementById(productPriceContainer).getElementsByClassName(price).innerHTML

如果不是正确的做法是什么？

由于

Answer 1

如果您在ID为price的元素中有一个类productPriceContainer的元素，则可以

 document.getElementById('productPriceContainer')
     .getElementsByClassName('price')[0].innerHTML

请注意getElementsByClassName中的 s 。它解释了为什么你不能像这样链。你没有一个名为getElementByClassName的函数，因为与id相反，没有任何元素具有给定的类。

Answer 2

几乎。

如果要传递字符串，则必须传递字符串而不是未定义的变量
getElementsByClassName（复数！）返回NodeList，而不是Node，因此您必须循环它以获取节点（然后您可以使用innerHTML。

Answer 3

您正在向方法传递变量而不是String - ＆gt;它应该是"price"而不是price。
按类名检索节点的方法是getElementsByClassName 您缺少“s”
它返回一个DOM元素数组，因此您必须遍历容器的子元素

例如：

document.getElementById("productPriceContainer").getElementsByClassName("price")[0].innerHTML = "Asdf";

将容器元素中具有类innerHTML的第一个DOM元素的"price"设置为“Asdf”

迭代元素可能如下所示：

var elements = document.getElementById("productPriceContainer")
if(elements) {
  var classes = elements.getElementsByClassName("price");
   for (var i = 0; i < elements.length; i++) {
     elements[i].innerHTML = "Asdf" + i;
    }
}

这是JSBin

如何链接getElementById和getElementsByClassName

3 个答案: