var li = document.querySelectorAll("li"); for(var i of li) { i.onclick = function() { alert(i.value); } }

这段代码存在一个问题，即点击任何一个 li 元素时，弹出的 alert 弹窗中都会显示 undefined，因为 i 的值在循环结束后会指向 li 列表的最后一个元素。

可以通过使用闭包来解决这个问题，如下所示：

var li = document.querySelectorAll("li");
for (var i = 0; i < li.length; i++) {
  (function(i) {
    li[i].onclick = function() {
      alert(li[i].value);
    };
  })(i);
}

在这个版本中，我们将事件处理程序定义为一个立即调用的函数表达式，该表达式将当前 i 的值作为参数传递，以便在点击事件发生时能够正确地引用 li 元素的值。

相关问题

var dian = document.getElementById("dian") dian.onclick = function(){ var ul = document.querySelector("#list3 ul") var li = document.querySelectorAll("#list3 li") for(var i = 0; i< li.length;i++){ l = document.createElement("li") m = li[i].innerHTML console.log(m) l.appendChild(m) ul.appendChild(l) } }这段代码有什么错误

这段代码可能存在以下几个错误：

1. 变量 l 和 m 没有声明。应该在使用之前使用 `var` 关键字声明这两个变量，例如 `var l = document.createElement("li")`。

2. `appendChild` 方法的参数应该是一个节点对象，而不是一个字符串。因此，将 `m` 直接传递给 `appendChild` 方法是错误的。可以先创建一个文本节点，然后将其添加到 `l` 中，例如 `l.appendChild(document.createTextNode(m))`。

3. 对于每个循环迭代，都会创建一个新的 li 元素，即使它们的内容都是相同的。这可能会导致性能问题。可以将 li 的复制过程移到循环外面，只创建一个新的 li 元素，并在循环中对其内容进行修改，例如：

var ul = document.querySelector("#list3 ul");
var li = document.querySelectorAll("#list3 li");
var newLi = document.createElement("li");
for (var i = 0; i < li.length; i++) {
  var m = li[i].innerHTML;
  console.log(m);
  var newContent = document.createTextNode(m);
  var cloneLi = newLi.cloneNode(false);
  cloneLi.appendChild(newContent);
  ul.appendChild(cloneLi);
}

var aDiv=document.querySelectorAll('.box')

回答: 这段代码使用了querySelectorAll方法来选择所有class为'box'的元素，并将其赋值给变量aDiv。通过querySelectorAll方法可以选择满足特定条件的多个元素，这里选择了class为'box'的元素。通过这个代码，我们可以得到一个包含了所有class为'box'的元素的NodeList集合。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* *3* [HTML5中类jQuery选择器querySelector的高级使用 document.querySelectorAll.bind(document);](https://blog.csdn.net/weixin_30876945/article/details/99481561)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT0_1"}}] [.reference_item style="max-width: 100%"]
[ .reference_list ]