【Vanilla Js 02】事件绑定与去除

时间:2022-12-12 04:38:29

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<style type="text/css">
			div{
				color:red;
			}
		</style>
	</head>
	<body>
		<div id="kent">
			kent(点我弹框)
		</div>
		<script type="text/javascript">
			
			var handler = function(){
				alert("good");
			}
			
			document.getElementById("kent").addEventListener("click",handler,false);
			
			document.getElementById("kent").removeEventListener("click",handler,false);
			

			
		</script>
	</body>
</html>



将以上的代码JS最后一句除去,就可以调用点击事件。

将最后一句加上就相当于卸载了当前事件


值得补充一句的是,为什么推荐用这种方法呢?有两点原因

1、可以绑定多个事件,如果只是用onclick的话,就只能绑定一个事件而已。如果你之前用了onclick,没关系,和onclick不冲突

2、可以卸载事件,这个是他的优点