问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

为什么item = null;在后面，前面函数中的item会为null，而不是执行了一次后再为null？

头像
跟我一起秃秃秃
    641128
    <body>
  <div dd="houdunren">在线学习</div>
  <div dd="hdcms">开源产品</div>
</body>
<script>
  let divs = document.querySelectorAll('div');
  divs.forEach(item => {
    let dd = item.getAttribute('dd');
    item.addEventListener('click',()=>{
      console.log(dd);
      console.log(item);//null
    })
    item = null;
  })
</script>

    请问为什么item = null;在后面，而前面console.log(item);会为null，而不是执行了一次后再为null？
    是因为dom事件是宏任务，同步任务先执行吗？希望能得到详细的解答，谢谢老哥们

    前端javascripthtmlhtml5
    阅读 1.5k
    1 个回答
    得票最新
    头像
    Mannix
      2.2k2311
      ✓ 已被采纳

      这里只是绑定点击事件的回调函数：

      item.addEventListener('click',()=>{
  console.log(dd);
  console.log(item);//null
})

      点击事件，当然是在点击的时候才执行，也就是在点击的时候才执行这两行代码：

      console.log(dd);
console.log(item);//null

      而

      item = null;

      这行代码在页面加载时就执行了，所以点击时 item 早就被改成 null 了

      如果把 item = null; 放进点击回调中

      item.addEventListener('click',()=>{
  console.log(dd);
  console.log(item);
  item = null;
})

      此时就变成第一次点击输出 div 元素，第二次点击才输出 null

      撰写回答
      你尚未登录，登录后可以
      • 和开发者交流问题的细节
      • 关注并接收问题和回答的更新提醒
      • 参与内容的编辑和改进，让解决方法与时俱进
      推荐问题