JavaScript基础|JavaScript基础事件对象 JavaScript基础事件对象

常规下：事件函数的第一个参数就是事件对象
事件对象：它记录了触发本次事件的相关信息

点击事件

事件对象详细图

文章图片

文章图片
图片.png

兼容问题：
ie8下不支持第一个参数写法，只支持window.event
火狐支持第一个参数写法

事件对象传参数

有传参的时候最后一个参数是事件对象

【JavaScript基础|JavaScript基础事件对象】例：

document.onclick = fn.bind(this , 1 , 2); function fn( a , b , e ) { /e是事件对象上面实参不用传传会报错 console.log( a ); console.log( b ); console.log( e ); }

1、clientX 鼠标坐标相对可视区域X轴坐标
2、clientY鼠标坐标相对可视区域Y轴坐标（兼容所有）
3、pageX鼠标坐标到左边的X轴坐标（不兼容低版本IE）
4、pageY鼠标坐标到文档顶部Y轴坐标
pageY兼容

文章图片
图片.png

e.type 得到的是事件对象名称

文章图片
图片.png 键盘事件

文章图片
图片.png

keyCode 得到的是键值

文章图片
图片.png 1、0 ====> 48
2、q ====> 81
3、ctrl ===> 17
4、enter ===> 13

code:得到的是按下哪个键

文章图片
图片.png 案例

文章图片

/*清除样式*/ *{margin: 0; padding: 0; } ul li{list-style-type: none; } a{text-decoration: none; color: inherit; } /*---------------------------------------------------*/ div{ position: absolute; top: 0; left: 0; width: 100px; height: 100px; background: red; }