target和this的区别

淩亂°似流年 2023-06-24 08:30 23阅读 0赞

区别 ： e.target 点击了那个元素，就返回那个元素 this 那个元素绑定了这个点击事件，那么就返回谁

<body>
        <div>123</div>
        <ul>
            <li>abc</li>
            <li>abc</li>
            <li>abc</li>
        </ul>
        <script>
            // 常见事件对象的属性和方法
            // 1. e.target 返回的是触发事件的对象（元素） this 返回的是绑定事件的对象（元素）
            // 区别 ： e.target 点击了那个元素，就返回那个元素 this 那个元素绑定了这个点击事件，那么就返回谁
            var div = document.querySelector('div');
            div.addEventListener('click', function(e) { 
                console.log(e.target);
                console.log(this);
    
            })
            var ul = document.querySelector('ul');
            ul.addEventListener('click', function(e) { 
                    // 我们给ul 绑定了事件 那么this 就指向ul 
                    console.log(this);
                    console.log(e.currentTarget);
    
                    // e.target 指向我们点击的那个对象 谁触发了这个事件 我们点击的是li e.target 指向的就是li
                    console.log(e.target);
    
                })
                // 了解兼容性
                // div.onclick = function(e) { 
                // e = e || window.event;
                // var target = e.target || e.srcElement;
                // console.log(target);
    
            // }
            // 2. 了解 跟 this 有个非常相似的属性 currentTarget ie678不认识
        </script>
    </body>

发表评论取消回复

表情：

评论列表（有 0 条评论，23人围观）

还没有评论，来说两句吧...

相关阅读

相关【this 和 super 的区别】

在 Java 中，this 和 super 都是关键字，表示当前对象和父类对象。 this 关键字可以用于以下几种情况：引用当前对象的成员变量，方法和构造方法，用于区

刺骨的言语ヽ痛彻心扉/ 2024年03月26日 16:58/ 0 赞/ 74 阅读

相关 MainAcitvity.this和this的区别

在Miwok应用开发过程中，在MainActivity类中用到了MainActivity.this，这里说明为什么不可用this。 1.先说明Context和Activit

朱雀/ 2023年08月17日 15:45/ 0 赞/ 163 阅读

相关 event.target 和 event.currentTarget 的区别

event.target > This property of event objects is the object the event was dispatched

喜欢ヅ旅行/ 2023年06月25日 02:21/ 0 赞/ 39 阅读

相关 target和this的区别

区别： e.target 点击了那个元素，就返回那个元素 this 那个元素绑定了这个点击事件，那么就返回谁 <body> <div>123</di

淩亂°似流年/ 2023年06月24日 08:30/ 0 赞/ 24 阅读

相关浅谈jQuery使用this和event.target

1、this和event.target的区别： JavaScript中事件会冒泡，所以this是可以变化的，但event.target不会变化，永远是触发事件的目标DOM元素

逃离我推掉我的手/ 2022年09月29日 04:19/ 0 赞/ 169 阅读

相关 this和super的区别

this表示对本类成员方法的引用 super表示对父类成员和方法的的引用两者不能同时出现在一个构造函数中，都需要出现在构造方法的第一行 package no2;

ゝ一世哀愁。/ 2022年06月17日 01:21/ 0 赞/ 261 阅读

相关 this和 $(this)的区别

今天在使用jquery来实现一个小功能的时候，发现了一个小问题，故在这里总结一下，供以后学习》问题：this 和 $(this)的区别 1.this 指的是ht

迈不过友情╰/ 2022年06月10日 08:21/ 0 赞/ 375 阅读

相关 AspectJ中target,this和within的区别

首先，AspectJ官方怎么描述这三个关键字： this(SomeType)：when the object currently executing (i.e. this)

雨点打透心脏的1/2处/ 2021年11月22日 13:46/ 0 赞/ 263 阅读

相关【JavaScript】this和event.target的异同

event.target 每次触发DOM事件时会产生一个事件对象（也称event对象），而事件对象也有很多属性和方法，其中target属性是获取触发事件对象的

蔚落/ 2021年11月11日 07:56/ 0 赞/ 152 阅读

相关 js this和event.target的区别

1.js中事件是会冒泡的，所以this是可以变化的，但event.target不会变化，它永远指向触发事件的DOM元素本身； 2.this和event.target都是dom

悠悠/ 2021年07月24日 23:19/ 0 赞/ 298 阅读