为什么"div[1]"有效，为什么"div.nextElementSibling"无效，因为在console.log中，当forEach方法处理第一个div 时，它们的显示方式相同
<--HTML-->
<!DOCTYPE html>
<html lang="en">
<head>
<title>Document</title>
<script defer src="main.js"></script>
</head>
<body>
<div class='div'>first</div>
<div class='div'>second</div>
</body>
</html>
<--JS-->
const divs = document.querySelectorAll('.div')
divs.forEach((div, id) => {
const clg = () => {
console.log(id)
//it works
divs[1].removeEventListener('click', clg)
//it doesn't
div.nextElementSibling.removeEventListener('click', clg)
}
div.addEventListener('click', clg)
//this DOM's elements for div1 are the same
console.log(divs[1],div.nextElementSibling)
})
这是因为，无论forEach循环中运行哪个循环，divs[1]都将始终显示固定值。
由于div包含2个元素
<div class='div'>first</div>
<div class='div'>second</div>
因此，对于forEach循环的每个循环，div值都会发生变化，divs[1]是一个固定值，它是
<div class='div'>second</div>
现在控制台记录
// Cycle 0
// Console.log(divs[1])
<div class='div'>second</div>
// Console.log(div.nextElementSibling)
<div class='div'>second</div>
// Cycle 1
// Console.log(divs[1])
<div class='div'>second</div>
// Console.log(div.nextElementSibling)
null