JavaScript事件
事件
JavaScript事件，就是用户或浏览器本身的某种行为，一般是用户对页面的一些动作引起的，比如用户的点击某个链接、在文本框中输入文本等。
绑定对应的事件
方法一：直接在元素上面添加一个事件属性
语法：
方法二：在js中找到dom添加事件
语法：
方法三：使用addEventListener
语法：
注意：
①第一个参数表示事件类型，不要使用on。
②第二个参数表示事件触发的函数。
常用的事件
鼠标事件
注意：
如果绑定事件的dom元素存在子元素，比如div嵌套
mouseover/mouseout 是在进入子元素，会再次触发事件。
mouseenter/mouseleave 在进入子元素，不会再次触发事件。
表单事件
键盘事件
窗口事件
综合案例
页面打开时，文本框内默认为hello，当光标聚焦到文本框时，默认文本hello消失，
文本框后面出现“至少6-12位”的用户名输入需求，且输入的用户名字体颜色为红色。
分析：
页面初始化后：
将出现文本框<input type="text"/>以及<span>标签用于输出聚焦后的内容，并且其属性value的值为hello。
当文本框获取聚焦后：
文本框中有获取聚焦事件onfocus，事件里将<span>标签中添加文本“至少6-12位”，且将文本框的css样式color值为red，且将属性value值为空。
代码展示：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<form action="../课堂/1.html" method="get" >
用户名：<input type="text" value="hello" id='name'/><span></span>
</form>
</body>
<script>
document.querySelector("#name").onfocus=function(){
let a = document.querySelector("#name");
a.value="";
a.nextElementSibling.innerHTML='至少6-12位';
a.style.color='red';
}
</script>
</html>
