事件

概述

JS是以事件驱动为核心的一门语言。

事件三要素

事件源(引发后续事件的标签)、事件(执行的事情)、事件处理程序(DOM操作)。

事件类型

事件名称 说明
onclick 鼠标单击
ondbclick 鼠标双击
onkeyup 按下并释放键盘上的一个键时触发
onchange 文本内容或下拉菜单中的选项发生改变
onfocus 获得焦点,表示文本框获得鼠标光标
onblur 失去焦点,表示文本框等失去鼠标光标
onmouseover 鼠标悬停。即鼠标停留在图片等的上方
onmouseout 鼠标移出,即离开图片等所在的区域
onload window.onload是在页面所有元素(包括图片)加载完毕触发。
onunload 关闭网页时
onsubmit 表单提交事件
onreset 重置表单时

执行事件步骤

获取事件源,绑定事件,书写事件驱动程序。

事件绑定的三种方式

(1)匿名绑定,最常用:

document.getElementById('box').onclick = function () {
    //...
}

(2)函数名绑定

document.getElementById('box').onclick = fn;    //函数名称后不能加小括号

function fn() {
    //...
}

(3)行内绑定

<div id="box" onclick="fn()"></div>
<!--函数名后面必须添加小括号-->
<script>
    function fn() {
        //...
    }
</script>

 

posted @ 2018-04-03 15:08  懒懒同学不懒  阅读(106)  评论(0编辑  收藏  举报