JavaScript事件监听

最新推荐文章于 2023-09-15 16:41:08 发布

噯鉬

最新推荐文章于 2023-09-15 16:41:08 发布

阅读量115

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/weixin_45488764/article/details/108568370

版权

js 实现事件监听

1、行内绑定

行内绑定：在ＨＴＭＬ　的标签中通过onclick属性进行绑定，绑定方式为：on＋　事件名称，　在将所触发你事件赋值给该属性

<button onclick='onClick()'></button>

2、使用元素进行事件绑定

使用element.onclick 进行事件绑定，通过操作DOM元素，为DOM绑定事件【使用形式同行内绑定】

window.onload = function (){
    let btn = document.getElementById('btn')
    btn.onclick=function(){
        alert('!!!')
    }
}

3、使用addEventListener()方法

使用 addEventListener() 方法，接受3个参数（要处理的事件名、作为事件处理程序的函数、一个布尔值，这个布尔值为 true 表示在事件捕获阶段调用事件处理程序，为 false 则在事件冒泡阶段调用）。有些浏览器不支持事件捕获（如 IE8 及更低版本），所以谨慎绑定捕获阶段的事件监听器

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script>
			window.onload = function(){
				var btn = document.getElementById('btn');
				btn.addEventListener('click',function(){
					alert("123");
				},false);
			}
		</script>
	</head>
	<body>
		<button id="btn">点击</button>
	</body>