1、事件三要素:
事件源 :要触发的对象 (一般是名词,事件发起者,比如开关按钮)
事件:怎么触发这个事情 (一般是动词,触发事件,比如点击开关)
事件处理程序:发生了什么事情 (处理结果,比如灯亮了)
事件源.事件 = function() {
事件处理函数
}
常见的事件:
事件名 | 说明 |
onclick | 鼠标单击 |
ondblclick | 鼠标双击 |
onkeyup | 按下并释放键盘上的一个键时触发 |
onchange | 文本内容或下拉菜单中的选项发生改变 |
onfocus | 获得焦点,表示文本框等获得鼠标光标。 |
onblur | 失去焦点,表示文本框等失去鼠标光标。 |
鼠标悬停,即鼠标停留在图片等的上方 | |
鼠标移出,即离开图片等所在的区域 | |
网页文档加载事件 | |
onunload | 关闭网页时 |
表单提交事件 | |
onreset | 重置表单时 |
例如:改变宽度
<script>
var demo = document.getElementById("demo");
//获得id为demo的div盒子给demo
var btn = document.getElementById("btn"); // 获得按钮
/*事件三要素*/
/*事件源.事件 = fucntion(){}*/
btn.onclick = function(){
demo.style.width = "400px";
}
</script>