js day8
事件绑定
事件：发生在html元素上的特定动作，鼠标点击，键盘按下，鼠标移入
事件三要素：事件源（触发事件的元素） 事件类型，事件触发后执行的函数
通过html触发事件（不建议）
<button onclick="alert(123)">点击</button>lv0 通过事件源.on事件类型=function(){
处理的函数
}
同一个事件源如果添加了多个相同时间类型的事件，只有最后一个添加的会生效
<div class="box">whsz</div>
<script>
const box=document.querySelect()
box.onclick=function(){
alert("123")
}
</script>mouseenter——鼠标移入
在事件绑定中this指向的是事件源
事件监听
事件源.
<div class="box">whsz</div>
<script>
const box=document.querySelect()
事件源.addEventListener("事件类型"，function(){
//执行代码
} ，//是否捕获和冒泡)
</script>事件对象
1，获取元素对象
<script>
//获取元素对象
const txt=document.querySelector("textarea")
//添加事件监听
//事件对象：保持着和本次相关的信息
txt.addEventListener("keydown",function(e){
//e.code是按键信息
if(e.code=="ENTER"){
alert("123")
}
})
</script>键盘输入
<textarea></textarea><script>const txt=document.querySelector("textarea")txt.addEventListener("keydown",function(e){if(e.code=="Enter"){alert("哈哈哈，你输入的内容被我看的一清二楚")}})</script>document.documentElement.addEvemt
//相对于浏览器窗口左上角
console.log（e.clientX）
阻止默认行为
e.preventDefault()——阻止默认行为
常见事件类型
鼠标事件
click——单击事件
dbclick——双击事件
mouseenter——鼠标移入
mouseleave——鼠标移出
mousemove——鼠标移动
键盘事件
keydown——键盘按下
e.code——记录按下的键盘值
表单事件
input（表单修改事件）
change
focus——获取焦点事件
blur——失去焦点事件
其他事件
页面加载事件——load 等到html，css以及图片等静态资源加载结束
DOMContentLoaded——等到html加载结束