javaScript事件绑定方式总结 

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript">
			function test(){
				console.log("test");
			}
		</script>
	</head>
	<body>
		<!-- “on+对应事件”标签属性 -->
		<button type="button" onclick="test()">按钮1</button>
		
		<input type="button" name="" id="bnt2" value="按钮2" />
		<script type="text/javascript">
			var element = document.getElementById("bnt2");
			// element.onclick=test;
			/* 等价于下面 */
			element.onclick=function test(){
				console.log("test");
			}
		</script>
		<input type="button" name="" id="bnt3" value="按钮三" />
		<script type="text/javascript">
			var element = document.getElementById("bnt3");
			// element.addEventListener("click",test);
			/* 等价于下面 */
			element.addEventListener("click",function test(){
				console.log("test");
			})
		</script>
	</body>
</html>

　　

 

posted @ 2021-06-07 11:15  衢  阅读(55)  评论(0)    收藏  举报