触发onclick事件获取当前元素各个属性参数

最新推荐文章于 2025-03-16 18:49:02 发布

Tarafireworks

最新推荐文章于 2025-03-16 18:49:02 发布

阅读量4.8k

点赞数 3

分类专栏：前端文章标签： javascript html html5

原文链接：http://www.hellohao.cn/?p=475

版权

前端专栏收录该内容

82 篇文章

订阅专栏

本文深入探讨了JavaScript中的onclick事件，讲解了event.target和event.currentTarget的区别。通过示例代码展示了如何在事件处理函数中获取触发元素的各种属性，如标签名、类名、ID及内容等，帮助开发者更好地理解和运用事件处理机制。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

自动生成元素的onclick事件
event.target返回触发事件的元素
event.currentTarget返回绑定事件的元素

<a onclick="test()">点击我</a>

<script>
    function test(){
    var is=event.currentTarget;
    console.log($(is)); //获取当前元素，类同this
    console.log(event.target);  //返回绑定事件的元素

    console.log(event.target.nodeName 　)　 //获取事件触发元素标签name 
    console.log(event.target.className　)　  //获取事件触发元素classname
    console.log(event.target.innerHTML)　　  //获取事件触发元素的内容
    console.log(event.target.id)　//获取事件触发元素id

    console.log(event.currentTarget.nodeName 　)　 //获取事件绑定元素标签name 
    console.log(event.currentTarget.className　)　  //获取事件绑定元素classname
    console.log(event.currentTarget.innerHTML)　　  //获取事件绑定元素的内容
    console.log(event.currentTarget.id)　//获取事件绑定元素id
    }

</script>