Javascript中事件对象的target和this的区别


本文摘自PHP中文网,作者逆旅行人,侵删。

在学习事件对象的时候,总是认为targetthis是一样的,直到后来才发现两者的区别还是挺大的,今天就带大家一起来看看。

1.当触发对象与绑定对象一致时

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Document</title>

</head>

<body>

    <ul class="list">

        <li class="itm">item1</li>

        <li class="itm">item2</li>

        <li class="itm">item3</li>

        <li class="itm">item4</li>

        <li class="itm">item5</li>

    </ul>

    <script>

        const li=document.querySelector("ul li:nth-of-type(4)");

        console.log(li);

 

        li.addEventListener("click",function(e){

            console.log(e.target);

            console.log(this);

        });

    </script>

</body>

 

</html>

点击item4这个li后,两者返回如下:

Snipaste_2021-04-09_10-09-08.png

阅读剩余部分

相关阅读 >>

typescript和javascript有什么区别

javascript中删除数组元素的方法有哪些

javascript中回文数是什么?怎么判断?

html和js实现简单的计算器

html5实现微信jssdk录音播放语音的实例

html5中一些可以优化的细节介绍

javascript中标识符的含义是什么

javascript自我管理是什么

javascript怎么将值转换成数字类型

javascript sort方法怎么排序

更多相关阅读请进入《javascript》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...