为元素绑定事件的几个方法
点击按钮绑定点击事件,鼠标移入事件,鼠标移出事件
首先给一个按钮做点击事件,为盒子绑定鼠标点击事件和鼠标移入移出事件。
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>键盘按下换背景色</title>
<style>
button{
width:100px;
height:30px;
background:orange;
border:none;
}
div{
margin-top:10px;
width:300px;
height:200px;
background:black;
}
</style>
</head>
<body>
<button>绑定事件</button>
<div></div>
</body>
</html>
效果图:
解析:给一个绑定事件的按钮,在没有点击这个按钮之前,下面的盒子不会有任何反应。再给一宽为300像素,高为200像素,背景颜色为黑色的盒子。
代码:
<script src="./jquery-1.12.2.js"></script>
解析:用jQuery的方法来写代码,需要引入jQuery插件。引入之后就可以开始为元素绑定点击事件了。
第一种方法
<