事件的分类
笔记
e对象
获取 e对象坐标
e.clientX
e.clientY
添加类名
this.className='';
获取元素的第一个子级
this.firstElementChild;
获取相对于页面的元素对象坐标--->更加稳定不容易受影响
e.PageX;
e.PageY;
文档事件
onload 文档事件
onbeforeUnload 退出浏览器前的提示
作用: 防止误操作
return e.returnValue
当用户进入或离开页面时就会触发 onload 和 onUnload 事件。
onload 事件常用来检测访问者的浏览器类型和版本,然后根据这些信息载入特定版本的网页。
onload 和 onUnload 事件也常被用来处理用户进入或离开页面时所建立的 cookies。例如,当某用户第一次进入页面时,你可以使用消息框来询问用户的姓名。姓名会保存在 cookie 中。当用户再次进入这个页面时,你可以使用另一个消息框来和这个用户打招呼:"Welcome John Doe!"。
鼠标事件
onclick 单击事件
阻止默认行为 return false
批量绑定 document.getElementsByTagName
ondblclick 双击事件
oncontextmenu 右键事件
onmouseover 鼠标放上去的事件
onmouseout 鼠标离开的事件
onmousemove 鼠标移动的事件
onmousedown 鼠标按下事件
onmouseup 鼠标抬起事件
//获取当前距可视窗口的偏移量
var l=move.offsetLeft;
var t=move.offsetTop;
键盘事件
onkeydown 键盘按下
键盘移动div
可以将input表单的值变成大写
组合按键
onkeyup 键盘抬起
onkeypress 键盘按下
表单事件
onfocus 获取焦点
onblur 丧失焦点
onchange 值在发生改变的时候
onselect 只能选中input输入框或者textarea文本域内容的时候触发
onsubmit 提交事件
onreset 重置事件
阻止冒泡
stopPropagation() 使用e对象里面的方法进行阻止
终止事件在传播过程的捕获、目标处理或起泡阶段进一步传播。
调用该方法后,该节点上处理该事件的处理程序将被调用,事件不再被分派到其他节点。
扩展
window.getComputedStyle();
getComputedStyle是一个可以获取当前元素所有最终使用的CSS属性值。返回的是一个CSS样式声明对象([object CSSStyleDeclaration])