返回单击元素Javascript的值时出现问题

我正在尝试Javascript，并首次通过制作一个简单的问答游戏与DOM交互。我所有的元素都是由JS动态生成的，除了几个div

这就是我的问题

我有

问题1。
（A）
（B）
（C）
（D）

我希望能够单击任何答案并返回值。为此，我编写了函数

function checkCorrectness(element){
    element.onclick = function(){       
        nodes = element.childNodes
        for(i = 0; i<nodes.length; i++){
            nodes[i].onclick = function(){console.log(nodes)};
        }
    }
 }
//Note answers selectsthe div containing the 4 <p> elements A,B,C,D
checkCorrectness(answers)

功能检查正确性（元素）{
element.onclick=function（）{
nodes=element.childNodes
对于（i=0；iAh），您已经发现了JavaScript闭包（）。对于JS新手来说，这是一个非常常见的错误，所以不要难过。当您记录
nodes[i]
时，您实际上是在访问索引中的
节点
，以获取最新的“i”值在函数执行时。在本例中，它是nodes.length，它是未定义的…如果这没有意义，很抱歉，请查看链接文章

你真的想要这样的东西：

var logNode = function(val) {
    return function() { console.log(nodes[val]) };
};

for(i = 0; i<nodes.length; i++){
    nodes[i].onclick = logNode(i);
}

var logNode=函数（val）{
返回函数（）{console.log（nodes[val]）；
};
对于（i=0；i而言，您的测验的整个逻辑可以写成几行

// JavaScript
window.onload = function(){
  // This is a simple structure to hold your question_id and the correct answer
  // var data = {'10':'B', '11':'D', '12':'A', '13':'A'}; ...
  // for this exampple we'll have only one
  var data = {'10':'B'};  
  var li = document.getElementsByTagName('UL')[0].children;
  for(i = 0; i < li.length; i++){
    li[i].onclick = function(){
      if(data[this.parentNode.id] == this.innerHTML){
        alert(this.innerHTML + " -> Correct"); 
      }else{
        alert('Nope!');
      }
    };
  }
};

// HTML
// Let's say every question has an `id` 
// I'd use a list for this case but you may use any other markup 
<ul id="10">
    <li>A</li>
    <li>B</li>
    <li>C</li>
    <li>D</li>
</ul>

//JavaScript
window.onload=函数（）{
//这是一个简单的结构，用于保存问题id和正确答案
//变量数据={'10'：'B'，'11'：'D'，'12'：'A'，'13'：'A'}。。。
//对于这个例子，我们只有一个
变量数据={'10'：'B'}；
var li=document.getElementsByTagName（'UL'）[0]。子级；
对于（i=0；i正确”）；
}否则{
警惕（‘不！’）；
}
};
}
};
//HTML
//假设每个问题都有一个“id”
//对于这种情况，我会使用列表，但您可以使用任何其他标记

A
B
C
D


工作
您必须为动态创建的元素委派事件。我建议您阅读以下内容：没有必要使用如此复杂的方法；请检查下面的答案，如果您发现它有用，请告诉我；）太棒了，谢谢！我感觉我做的每件事都太复杂了。我要看一看并试着重构。@jasnonaz，正如我说的，如果你需要任何进一步的帮助，请告诉我；）啊，这是真的。奇怪。我会重新评估并尝试修复它！谢谢你的帮助！没问题。请将答案标记为“接受”如果这解决了你的问题，那么其他人可以受益：）。就可以了！我实际上不得不在晚上停止工作。不幸的是，我明天早上会看看我是否可以实现这一点。哇，成功了，谢谢！闭包很奇怪。我肯定要习惯它们。
// JavaScript
window.onload = function(){
  // This is a simple structure to hold your question_id and the correct answer
  // var data = {'10':'B', '11':'D', '12':'A', '13':'A'}; ...
  // for this exampple we'll have only one
  var data = {'10':'B'};  
  var li = document.getElementsByTagName('UL')[0].children;
  for(i = 0; i < li.length; i++){
    li[i].onclick = function(){
      if(data[this.parentNode.id] == this.innerHTML){
        alert(this.innerHTML + " -> Correct"); 
      }else{
        alert('Nope!');
      }
    };
  }
};

// HTML
// Let's say every question has an `id` 
// I'd use a list for this case but you may use any other markup 
<ul id="10">
    <li>A</li>
    <li>B</li>
    <li>C</li>
    <li>D</li>
</ul>