js获取点击的dom

文章介绍了如何使用JavaScript的事件监听器来获取点击的DOM元素,特别是event.target用于获取最初被点击的元素。同时,讲解了event.currentTarget或this指向绑定事件的元素,以及如何使用event.stopPropagation()停止事件冒泡和event.preventDefault()取消默认行为。

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

可以使用事件对象来获取点击的 DOM 元素,如下所示:

document.addEventListener('click', function(event) { 
  const target = event.target; console.log('点击的 DOM 元素是:', target); 
});

在事件函数的参数中,event.target 表示最初被点击的元素。如果需要获取点击的父级元素(如点击了某个按钮,而不只是该按钮内的文本),则可以使用 event.currentTarget 或 this,它们指向绑定事件的元素。

如果需要停止事件冒泡,可以使用 event.stopPropagation() 方法。如果需要取消默认行为,则可以使用 event.preventDefault() 方法。注意,这两个方法需要在绑定事件的元素上调用,而不能在 event 对象上调用。

document.querySelector('.btn').addEventListener('click', function(event) { 
  event.stopPropagation(); // 停止事件冒泡 event.preventDefault(); 
  // 取消默认行为 const target = this; 
  // this 指向绑定事件的元素 console.log('点击的 DOM 元素是:', target); 
});

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值