div元素在点击时显示为null的原因分析
代码中出现了一个常见的误解：当在循环中对元素执行item = null;时，预期它是仅在当前循环执行一次，并在下一个循环之后保持元素引用不变。然而，这并不是DOM事件处理器的行为方式。
DOM事件处理器
DOM事件处理器是在用户与页面交互时异步执行的回调函数。当addEventListener函数附加到元素时，所提供的回调函数被安排在页面加载后执行时触发。在这种情况下，item = null;语句在页面加载时执行，而不是仅在附加事件处理程序时执行。
循环处理
在循环内部，item变量是每个元素的引用。当item = null;执行时，它将该特定元素的引用设置为null，但它不影响循环外部的其他元素。因此，当事件处理程序被触发时，item对已经为null的元素的引用已被修改，并且因此打印null。
宏任务与微任务
在JavaScript中，代码执行分为宏任务和微任务。宏任务包括DOM更新、事件处理程序等，而微任务包括Promise解析和setTimeout回调。在宏任务之前会执行微任务。
在这个场景中，将元素设置为null的是宏任务，而触发事件处理程序也是宏任务。由于页面加载是一个宏任务，item被设置为null在事件处理程序之前执行，这是为什么在循环内部打印null的原因。
解决方案
要避免此问题，可以将元素引用存储在闭包内，如下所示：
divs.forEach(itemDiv => {
let dd = itemDiv.getAttribute('dd');
itemDiv.addEventListener('click', () => {
console.log(dd);
console.log(itemDiv);
})
}) 
