DOM 文档对象模型
事件 :实现用户与浏览器的交互
事件流 :从页面接受事件的顺序,事件捕捉,和事件冒泡
事件捕获: 不太具体的节点更早接收事件,而具体的节点最后接收事件
事件冒泡: 事件最开始由具体的元素,然后逐渐传播到不具体的那个
事件处理程序:
1.HTML事件
2.DOM0级事件处理程序:把一个函数赋值给事件处理程序
3.DOM2级事件处理程序:addEventListener removeEventListener
1>参数一:处理的事件名
2>参数二:事件处理的函数
3>参数三:布尔值 true:捕获
false:冒泡(默认)
绑定事件属性和addEventListener()区别在哪:
事件属性能绑定多次事件,但最后一次会把前面的覆盖掉
事件监听能绑定多次事件,每一个事件都是独立的,不会被覆盖
鼠标事件
| |
---|
onclick | 点击 |
ondblclicked | 双击 |
onmousedown | 鼠标上任意键都可触发 |
onmouseup | 鼠标松开时触发 |
onmouseenter | 鼠标指针移动到元素上时触发 不会冒泡 |
onmouseleave | 鼠标移出元素时触发 |
onmouseover | 鼠标指针移动到标签元素上触发 会冒泡 |
onmouseout | 鼠标移出元素时触发 |
onmousemove | 鼠标指针移动到元素上触发 |
onwheel | 表示滚轮的滚动 【deltaX 表示水平滚动】 【 deltaY 表示垂直滚动 】 |
表单事件
| |
---|
blur、foucsout | 失去焦点时触发 【区别是onblur不支持冒泡】 |
focus 、focusin | 获取焦点时触发 |
select | 选中文本时触发 |
oninput | 用户输入时立即触发 |
onchange | 更改文本,并且焦点离开时触发 |
error | 图片加载失败或页面脚本出现错误时触发 (没有这个图片,或图片名字错误) |
submit | 指表单提交前,可以在这个事件中检查用户的输入是否合适,如果不合适使用event对象中的preventDefault阻止表单提交 |
reset | 可把表单中的元素重置为他们的默认值 |
注:confirm 弹出一个确认框,确认框有两个按钮
确认:返回true
取消:返回false
键盘事件
| |
---|
onkeyup | 按键弹起时触发 |
onkeydown | 按键按下时不断触发 |
onkeypress | 键盘按键被按下并释放一个键时触发 |