window.onland: 当前页面加载完毕后执行的方法,该方法用于,包裹所有的内联js代码,解决js获取html标签时,标签还没有加载的情况,保证先加载页面,再加载js功能提高用户的体验。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>事件</title>
<style>
</style>
</head>
<body>
<input type="text" class="inp">
<br>
<input type="text" class="inp">
<br>
<input type="text" class="inp">
<br>
<input type="text" class="but" value="选中文本时触发">
<br>
<input type="text" class="but" value="内容改变时触发">
<br>
<input type="text" class="but">
<script>
window.onload = function(){ //存放所有内联js代码
inp = document.getElementsByClassName("inp");
//失去焦点
inp[0].onblur = function(){
console.log("我是去焦点了")
}
// 获得焦点
inp[2].onfocus = function(){
console.log("我获得了焦点")
}
// 选中文本时触发
but = document.getElementsByClassName("but");
but[0].onselect = function(){
console.log("选中文本触发")
}
// 内容改变时触发
but[1].onchange = function(){
console.log("内容改变触发")
}
// 一下方法跟上面使用方法类似
// onreset 重置时触发
// ondblclick 双击时触发
// on mouse over:鼠标指针移动到指定的对象上时发生。
// onmouseout:鼠标指针移出指定的对象时发生。
// onmousedown:鼠标按键被按下时发生。
// onmouseup:鼠标按键被松开时发生。
// onresize:窗口在跳动大小时触发
// onsubmit:事件在表单的确认按钮被点击时触发
}
</script>
</body>
</html>