Question

我对querySelectorAll有疑问。

这是我的代码：

$(window).load(
    function() {

        // Add animations
        var wwa = document.querySelectorAll(".wwa-box");

        if (window.innerWidth > 992) {
            wwa.classList.add("bounceIn");
        }

        // WOW init
        new WOW().init();

    }
);

控制台：

TypeError: wwa.classList is undefined

我想在课程 .wwa-box 的所有标签中添加课程 .bonuceIn 。

Answer 1

因为它是一个nodeList集合，您将其视为单个项目。你需要遍历它们并设置classList。

var wwa = document.querySelectorAll(".wwa-box");
for (var i=0; i<wwa.length; i++) {
     wwa[i].classList.add("bounceIn");
}

Answer 2

问题是因为wwa是NodeList，如果只有一个类wwa-box的元素可以使用document.querySelector(".wwa-box");它只返回第一个元素，或者使用foreach if你的.wwa-box很少。

Answer 3

这是因为wwa是一个集合。您可以使用一个简单的循环来迭代它并添加该类。见jsfiddle

  for (i = 0; i < wwa.length; i++){
     wwa[i].classList.add("bounceIn");
  }

Answer 4

正如控制台所说：

TypeError：wwa.classList未定义

这个属性真的与wwa有关吗？你不应该放一个debbuger并导航并查看它拥有的属性吗？

使用其他答案，请参阅后面的索引并使用for进行导航并添加该类。

querySelectorAll在我的脚本中不起作用

4 个答案: