三种方式对dom进行绑定事件
方法一,直接在dom里写事件
方法二:在JavaScript里给dom绑定事件
方法三:使用事件监听函数对dom进行绑定
代码如下,使用代码时,分别使用三个方法时,记得去掉注释号
三种方式对dom进行绑定事件
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>三种方式对dom进行绑定事件</title>
<style type="text/css">
#demo{
width: 300px;
height: 300px;
background: #EDEDED;
margin: 50px;
}
</style>
</head>
<body>
<!--方法一,直接在dom里写事件-->
<!--<div id="demo" οnclick="this.style.background='red'">
qq
</div>-->
<div id="demo">
qq
</div>
<script type="text/javascript">
var demo = document.getElementById('demo');
/*方法二:在JavaScript里给dom绑定事件*/
// demo.onclick = function(){
// this.style.backgroundColor='blue';
// };
/*方法三:使用事件监听函数对dom进行绑定*/
demo.addEventListener('click',function(){
this.style.backgroundColor='yellow';
})
</script>
</body>
</html>