1、绑定事件监听函数通常有三种方法
①在HTML中定义元素的事件相关属性(不符合内容与行为分离原则):
<button οnclick="console.log('hello')">按钮</button>
<body οnlοad="initData()">。。</body>
②在js中为元素的事件相关属性赋值(符合内容与行为分离,但是一个元素只能绑定一个时间监听函数):
btn.οnclick=function(){...};
document.body.οnlοad=initData;
function initData(){...};
③高级事件处理方式,一个事件可以绑定多个监听函数:
btn.attachEvent('onclick',function(){..}) //IEbtn.addEventListener('click',function(){..})//DOM
2、获取event事件对象
①IE浏览器
——html或者js代码中可以直接使用event:
<p οnclick="console.log(event.clientX)">text</p>
function initData(){
console.log(event.clintX)
}
②Firefox浏览器
——html代码中可以直接使用event:
<p οnclick="console.log(event.clientX)">text</p>
——js代码中不能直接使用event,需要在html中将event中作为参数传给js函数:
<p οnclick="initData(event)">text</p>
function initData(){
console.log(event.clintX)
}
③在js代码中,如果使用方法二和方法三绑定事件监听函数时,firefox会将事件对象默认以第一个参数凡是传入
此时可以使用arguments[0]获取event也可以用放置一个形参保存事件对象event
——firefox浏览器:
var e=event||arguments[0]
或者用第一个形参来接收保存event也即arguments[0]
function(sj)
var e=enent||sj
}