时间戳

首页 > 解决方案 > 为什么我收到错误“无法读取 null 的属性 'appendChild'”

javascript - 为什么我收到错误“无法读取 null 的属性 'appendChild'”

问题描述

我对以下代码有疑问。我得到一个错误：app.js:141 Uncaught TypeError: Cannot read property 'appendChild' of null

const cartDOM = document.querySelector(".cart__center");

    addToCart({ title, price, image, id }) {
        let div = document.createElement('div');
        div.classList.add('cart__item');
    
        div.innerHTML = `<img src=${image} alt="">
        <div>
          <h3>${title}</h3>
          <h3 class="price">$${price}</h3>
        </div>
        <div>
          <span data-id=${id}>`;
    
        cartDOM.appendChild(div);
      }
    }

标签： javascript

解决方案

您看到该错误是因为

const cartDOM = document.querySelector(".cart__center");

被解析为null，这意味着使用您提供的选择器在文档中找不到元素".cart__center"。

这可能是因为：

  • 该元素与您的选择器条件不匹配。也许不是类名，而是一个 id 或其他什么？
  • 该元素目前不在 DOM 中以执行该元素querySelector()，可能尚未加载/渲染。

不幸的是，没有提供有关该问题的更多详细信息，这对于提出解决方案很有用。

所以我只能希望至少我已经提供了一些有用的见解，并且我建议您检查应用程序的逻辑以找到修复它的最佳方法。

推荐阅读