事件基础
1JavaScript事件是由访问web页面的用户引起的一系列操作。
2当用户执行某些操作的时候，会引发自动再去执行一系列代码。或者用来获取事件的详细信息，如鼠标位置，键盘按键等。
鼠标事件 键盘事件 HTML事件
事件处理函数：
1、onclick
2、onmouseover
3、onmousedown
4、onmouseup
onsubmit
onchange
onfocus
onblur
oninput
//这是事件对象的几个方法
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style type="text/css">
div{
width: 200px;
height: 200px;
background: red;
}
</style>
</head>
<body>
<div id = "test">aaa</div>
<form action="">
<input type="text">
<input type="submit" name="" id="" value="提交">
</form>
<script>
var oDiv = document.getElementById("test");
var oForm = document.getElementsByTagName("form")[0];
var aInput = document.getElementsByTagName("input");
/* oDiv.onclick = function(){
//alert(this.innerText);
// alert(oDiv.innerHTML);
// alert("click");
console.log("click");
}; */
/* 鼠标移入
oDiv.onmouseover = function(){
alert(oDiv.innerHTML);
} */
/* oDiv.onmousedown = function(){
// alert("mousedown");
console.log("mousedown");
} */
/* oDiv.onmouseup = function(){
// alert("mouseup");
console.log("mouseup");
} */
/* 输出顺序为
mousedown
mouseup
click */
/* oForm.onsubmit = function(){
console.log("submit");
// 把默认行为阻止一下
return false;
} */
aInput[0].onfocus = function(){
console.log("focus");
}
aInput[0].onblur = function(){
console.log("blur");
}
aInput[0].onchange = function(){
console.log("change");
}
aInput[0].oninput = function(){
console.log("input");
}
</script>
</body>
</html>
