Question

未捕获的类型错误：无法读取 ratings.js:4 处的 null 属性“length”

2020-07-22

249

javascript

这是我自己的评级插件

但是我在运行它时收到错误

这是错误：

Uncaught TypeError: Cannot read property 'length' of null
at rating.js:4

这是我的rating.js

const stars = document.querySelector(".rating".children);
const ratingValue = document.querySelector("#rating-value");

for (let i = 0; i < stars.length; i++) {
    stars[i].addEventListner("mouseover", function () {
        for (let j = 0; j < stars.length; j++) {
            stars[j].classList.remove("fa-star");
            stars[j].classList.add("fa-star-o");
        }
        for (let j = 0; j <= i; j++) {
            stars[j].classList.remove("fa-star-o");
            stars[j].classList.add("fa-star");
        }
    })
    stars[i].addEventListner("click", function () {
        ratingValue.value = i + 1;
    })
}

我不是 JavaScript 专家，但我需要在我的项目中使用它。

Answer 1

您的选择器是错误的，因为您试图将字符串（不存在）的 children 属性传递给 document.querySelector 。这相当于 document.querySelector(undefined) ，它返回 null 。

将

const stars = document.querySelector(".rating".children);

更改为

const stars = document.querySelector(".rating").children;

此外， addEventListner 应为 addEventListener 。

Answer 2

这就是出错的地方。

const stars = document.querySelector(".rating".children);
// should be
const stars = document.querySelector(".rating").children;

Answer 3

有两点：您在添加事件侦听器时输入了错误。 addEventListner - 此外， .children 应该位于查询选择器的括号之外。您尝试定位查询的类的子类，因此它应该位于括号之外。