瀏覽器如何知道要刪除哪一個？

Question

 var b=0 const btn = document.getElementById(`add`); btn.addEventListener(`click`, function(){ b++; console.log(b) for (let i = b; i <= b; i++) { var num = i.toString(); var yazi = document.getElementById("yazi").value; const li = document.createElement("li"); li.className = `todos${num}`; li.innerHTML = `<div id= "yazii">${yazi}</div><div id="sil"><button class="x" id="x${num}">X</button> </div>`; document.getElementById("todo").appendChild(li); console.log(yazi); const sil = document.getElementById(`x${num}`); console.log(sil); sil.addEventListener(`click`, function(){ console.log(sil); sil.parentElement.parentElement.remove(); }) } });

 <div class="container"> <div class="todoheader">To-Do List <div id="sag"><input type="text" id="yazi"><button id="add">Add</button></div></div> <div class="todocontainer"> <ul id="todo"> </ul> </div> </div>

我學習初學者 javascript 作為愛好。 試圖創建一個簡單的待辦事項列表。 它起作用了，但是在我查看了代碼之后，我無法理解它為什么以及如何起作用。 我將“sil”聲明為 const，並在每個循環中一次又一次地給它一個值。

1-在 udemy 課程中，講師指出 const 值無法更改，那么它是如何工作的？

2-“sil.addEventListener”->這個監聽器function如何刪除正確的列表元素？

Answer 1

我將“sil”聲明為 const，並在每個循環中一次又一次地給它一個值。

在 udemy 課程中，instrıctor 指出 const 值無法更改，那么它是如何工作的呢？

循環的每次迭代都會創建一個新環境，因此每次迭代基本上都有自己的sil變量。 您永遠不會為現有的sil變量分配新值（如前所述，這將不起作用）。

"sil.addEventListener" -> 這個監聽器function怎么刪除了正確的列表元素？

出於同樣的原因：每次迭代都有自己的sil變量。 在每次迭代中，都會創建一個可以訪問該變量的新事件處理程序。 該變量保存對在該循環迭代中處理的元素的引用。