Question

因此，我需要从另一个JavaScript文件进入addToCart类。但是addToCart不在html中，而是在javascript中：

function loadMeals() {
  let i = 0;
  let id = 1;
  let fillMealList = document.querySelector("#fillMealList");
  for (let i = 0; i < meals.length; i++) {
    let item = meals.find(item => item.id === id);
    fillMealList.innerHTML +=
      "<article>" +
      "<h3>" + item.title + "</h3>" +
      "<figure>" +
      "<img src='images/" + item.img + "'" + ">" +
      "<figcaption>" +
      "Meal by: " + "<span>" + item.cook + "</span>" +
      "</figcaption>" +
      "</figure>" +
      "<div class='info'>" +
      "<p>€ <span>" + item.price + "</span>" + "/pp" + "</p>" +
      "<a href='#' class='addToCart'>Order</a>" +
      "</div>" +
      "</article>";
    id++;
  }
}

现在，我需要单击类别为addToCart的“订单”。所以我做到了：

document.querySelector("#addToCart").addEventListener("click", addOrder);

现在我得到了错误：

TypeError：document.querySelector（...）为空；无法访问其“ addEventListener”属性

有人可以帮我吗？

Answer 1

addToCart是一门课程，因此您需要做.addToCart而不是#addToCart。将其更改为

document.querySelector(".addToCart");

请注意，如果该类只有一个元素，则addEventListener将适用于您的情况。否则，您需要使用querySelectorAll()并将addEventListener()函数附加到每个元素。

从其他js文件获取html类

1 个答案: