每次 div 更改時添加事件處理程序

Question

我正在嘗試將事件處理程序添加到包含經常更改的元素的特定 div。 有不同的選項卡，每個選項卡在單擊時呈現來自 API 的不同數據問題是我需要向每個選項卡中的某些元素添加事件處理程序。 當我添加事件處理程序並且選項卡更改時，事件處理程序也會更改。

我如何能：

• 僅在頁面加載后設置事件處理程序
• 每次標簽重新加載時

Answer 1

您可以檢查元素/元素更新，如果它們已更改，請在目標上使用removeEventListener 。

另一個效率不高但仍然有效的選項是使用addEventListener函數的第三個參數作為選項。 {once: true}將使您的事件偵聽器僅發生一次，然后您檢查元素/元素是否已更改，然后附加另一個偵聽器或重用相同的偵聽器。 更多關於MDN

Answer 2

我意識到在選擇元素后我一直在清除它們，然后我試圖更新它們，即使我已經清除了它們。

解決方案是重新選擇它們

例如：當我的程序啟動時，我 select 的元素是這樣的：

const ele = document.querySelector(".class")

然后在代碼中的某些地方，我像這樣清除父元素：

document.querySelector(".parentElementClass").innerHTML = "";

清除后，我嘗試像這樣使用清除的元素：

ele.addEventListener...

這是錯誤的，這就是錯誤出現的地方。 我要做的是再次重新選擇元素，然后像這樣添加事件偵聽器：

const ele = document.querySelector(".class")
ele.addEventListener("...