在JavaScript中给我们提供了很多处理事件的方法
注意:事件均以on前缀开始;事件不会自己执行,需要触发。
事件三要素:
事件对象
事件名称
事件处理函数
常用方法如下:
onabort 图像加载被中断
onblur 元素失去焦点
onchange 用户改变域的内容
onclick 鼠标点击某个对象
ondblclick 鼠标双击某个对象
onerror 当加载文档或图像时发生某个错误
onfocus 元素获得焦点
onkeydown 某个键盘的键被按下
onkeypress 某个键盘的键被按下或按住
onkeyup 某个键盘的键被松开
onload 某个页面或图像被完成加载
onmousedown 某个鼠标按键被按下
onmousemove 鼠标被移动
onmouseout 鼠标从某元素移开
onmouseover 鼠标被移到某元素之上
onmouseup 某个鼠标按键被松开
onreset 重置按钮被点击
onresize 窗口或框架被调整尺寸
onselect 文本被选定
onsubmit 提交按钮被点击
onunload 用户退出页面
常见的事件写法有三种我们以最常见的点击事件为例:
1、嵌入式(传统事件绑定):直接写在html中;例如:
//给按钮添加点击事件
<button onclick="function(){函数体;}">按钮</button>
优点:简单易懂
缺点:不利于多人开发
2、脚本模型(现代事件绑定):在js中完成事件绑定 例如
//通过document.getElementById()方法找到id为btn的按钮并把它放在名为btn的变量中
var btn=document.getElementById("btn");
btn.onclick=function(){
要执行的函数体;
};
这是目前最流行的写法
3、w3c事件:
通过两个方法来绑定事件
添加事件:addEventListener(事件名(例如:click 注意:在这里不需要加前缀on),函数名(注意:函数名后面不需要加括号),false);
删除事件:removeEventListener(括号内与添加事件用法一致);