南笙前端工程
2021-05-14 01:12
采纳率: 100%
浏览 53

您好,我想知道代码中this的指向为什么是box?

 <script>

      var box=document.querySelector('.box');

      box.addEventListener('mousemove',function(e){

        var x=e.pageX - this.offsetLeft;

        var y=e.pageY - this.offsetTop;

        this.innerHTML='X坐标是'+x+'Y坐标是'+y;

      });

    </script>

  • 写回答
  • 好问题 提建议
  • 关注问题
  • 收藏
  • 邀请回答

5条回答 默认 最新

  • CSDN专家-showbo 2021-05-14 08:53
    已采纳

    dom.addEventListener或者dom.onxxxx绑定的事件函数中默认this为绑定事件时的dom对象,除非用bind更改过内部this对象 

    <div class="box">.box</div>
    <div id="box">#box</div>
    <script>
    
        var box = document.querySelector('.box');
        box.addEventListener('mousemove', function (e) {
            var x = e.pageX - this.offsetLeft;
            var y = e.pageY - this.offsetTop;
            this.innerHTML = 'X坐标是' + x + 'Y坐标是' + y;
        });
        box.addEventListener('mousemove', function (e) {
            var x = e.pageX - this.offsetLeft;
            var y = e.pageY - this.offsetTop;
            this.innerHTML = 'X坐标是' + x + 'Y坐标是' + y;
        }.bind(document.querySelector('#box')));
    </script>
    已采纳该答案
    评论
    解决 无用
    打赏 举报
  • CSDN专家-三岁丫 2021-05-14 01:27

    因为这是 box 的事件,你可以理解为,你就是 box ,然后事件就是有人打了你一拳,然后你要干什么。

    评论
    解决 无用
    打赏 举报
  • this是函数所操作的对象。
    当把函数赋值(绑定)给一个dom元素的事件,在事件触发时,函数内this的值就是触发事件的那个dom元素。
     

    评论
    解决 无用
    打赏 举报
  • 因为是在给box添加鼠标移动事件,所以this代表box。操作那个对象,this就代表那个对象。

    评论
    解决 无用
    打赏 举报
  • 有问必答小助手 2021-05-14 18:18

    您好,我是有问必答小助手,您的问题已经有小伙伴解答了,您看下是否解决,可以追评进行沟通哦~

    如果有您比较满意的答案 / 帮您提供解决思路的答案,可以点击【采纳】按钮,给回答的小伙伴一些鼓励哦~~

    ps:问答VIP仅需29元,即可享受5次/月 有问必答服务,了解详情>>>https://vip.csdn.net/askvip?utm_source=1146287632

    评论
    解决 无用
    打赏 举报

相关推荐 更多相似问题