為什麼在使用querySelectorAll()時querySelector只選擇第一個元素？

為什麼 querySelector 只選擇第一個元素以及如何解決這個問題？

當在選擇器上使用 querySelectorAll() 方法時選擇多個元素，它會傳回一個節點清單。

在提供的程式碼中，您使用 querySelectorAll() 選擇類別為「weekdays」的所有元素。問題是您稍後在程式碼中使用 querySelector() 為清單中的每個元素新增事件偵聽器，該事件偵聽器僅針對清單中的第一個元素。

要解決此問題，您應該使用forEach() 迭代列表中的每個元素並向每個元素添加事件偵聽器。

以下是更新後的程式碼：

document.querySelectorAll(".weekdays").forEach(elem => elem.addEventListener("click",
 () => {
    document.querySelector(".bg-modal").style.display = "flex";
  }));

以上是為什麼在使用querySelectorAll()時querySelector只選擇第一個元素？的詳細內容。更多資訊請關注PHP中文網其他相關文章！