《JavaScript》DOM删除事件

最新推荐文章于 2023-12-02 14:16:41 发布

glglgl1

最新推荐文章于 2023-12-02 14:16:41 发布

阅读量1k

点赞数

CC 4.0 BY-SA版权

文章标签： javascript 开发语言

本文链接：https://blog.youkuaiyun.com/glglgl1/article/details/123806015

本文主要探讨了在JavaScript中如何删除DOM元素上的事件监听器，包括传统的删除方式和使用addEventListener的删除方法。通过实例展示了在点击事件上的添加与删除，确保事件在需要时触发，不需要时能够正确移除。

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

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
		div 
		{
			width: 100px;
			height: 100px;
			background-color: #00FFFF;
		}
		ccb
		{
			width: 10px;
			height: 50px;
			background-color: #FF0000;
		}

	</style>
	</head>
	<body>
		<div>1</div>
		<div>2</div>
		<div>3</div>
		<ccb>5</ccb>
		<ccb>6</ccb>
		<ccb>9</ccb>
		<script>
		var divs = document.querySelectorAll('div');
		divs[0].onclick = function()
		{
			alert(11);
			
			divs[0].onclick = null;
		}
		divs[1].addEventListener('click', fb)
		function fb()
		{
			alert(220);
			divs[1].removeEventListener('click', fb);
		}
		</script>
	</body>
</html>

传统方式删除事件

addEventListener删除事件

在divs[1].addEventListener('click', fb)里面的fn 不需要调用加小括号

点击图片中的样式1