在用鼠标触发事件时，主要的事件属性包含鼠标的位置和按键的状态，比如：clientX和clientY指定了鼠标在窗口坐标中的位置，button和which指定了按下的鼠标键是哪个。
function moveFn(event) { console.log(event.screenX) // 获取鼠标基于屏幕的X轴坐标 console.log(event.screenY) // 获取鼠标基于屏幕的Y轴坐标 console.log(event.clientX) // 获取鼠标基于浏览器窗口的X轴坐标 console.log(event.clientY) // 获取鼠标基于浏览器窗口的Y轴坐标 console.log(event.pageX) // 获取鼠标基于文档的X轴坐标 console.log(event.pageY) // 获取鼠标基于文档的Y轴坐标 } function clickFn(event) { console.log(event.button) // 获取鼠标按下的键。非IE浏览器中0为鼠标左键，1为鼠标中键，2为鼠标右键 console.log(event.which) // 获取指定事件上哪个键盘键或鼠标按钮被按下 } document.addEventListener('mouseover', moveFn, false); document.addEventListener('click', clickFn, false);
4.键盘事件属性
在用键盘触发事件时，主要的事件属性包含键盘的按键keyCode和是否按下特殊键，比如：keyCode指定了按下键的键码值，ctrlKey指定是否按下了ctrl键。
function keyFn(event) { console.log(event.keyCode); // 获取按下键的键码值 console.log(event.ctrlKey); // 获取是否按下了ctrl键 console.log(event.shiftKey); // 获取是否按下了shift键 console.log(event.altKey); // 获取是否按下了alt键 console.log(event.metaKey); // 获取是否按下了meta键 } document.addEventListener('keyup', keyFn, false);
类似的事件属性还有表单事件属性和window事件属性等，这里不再做详细介绍。有兴趣的同学可以查阅相关资料。
总结
本文主要讲解了DOM事件中Event对象的常用属性和方法，同时也介绍了其在IE中的兼容性问题及解决方案。然而关于DOM事件的知识点远不止这些，希望仅此能够帮助初识DOM的开发者。
备注：文本参考自《Javascript权威指南》一书及慕课网教程《DOM事件揭秘》。
以上就是本文的全部内容，希望对大家有所帮助，有兴趣的朋友可以看下《DOM事件的深入浅出（一）》，谢谢对脚本之家的支持！
您可能感兴趣的文章: