原文:改变attachEvent内部的this指向 封装兼容性的 addEvent(elem, type, handle);方法
<div style="width:100px; height:100px; background-color:red"></div><script>
var div = document.getElementsByTagName('div')[0];
div.onclick = function () {
console.log(this);
} //<div style="width:100px; height:100px; background-color:red"></div>
div.addEventListener('click', function () {
console.log(this);
}, false) //<div style="width:100px; height:100px; background-color:red"></div>
div.attachEvent('click', function () {
console.log(this);
})
//演示不了,只能在IE中演示,而且这里的this指向的是window
</script>
1.ele.onxxx = function (event) {} 程序this指向是dom元素本身
2.obj.addEventListener(type, fn, false); 程序this指向是dom元素本身
3.obj.attachEvent(‘on’ + type, fn); 程序this指向window
因为attachEvent方法在使用时,内部的this指向的是window,不方便,所以有时候要把这里的this变成自身
改变attachEvent内部的this指向
var div = document.getElementsByTagName('div')[0];
div.attachEvent('onclick', function () {
handle.call(div); //通过.call方法,把指向改成div
//然后再在外部的handle函数中执行,这样this就绝对指向div了。});function handle() {
//事件处理程序}
封装兼容性的 addEvent(elem, type, handle);方法
function addEvent(elem, type, handle) { if(elem.addEventListener) {
elem.addEventListener(type, handle, false);
}else if(elem.attachEvent) {
elem.attachEvent('on' + type, function () {
handle.call(elem);
})
}else{
elem['on' + type] = handle;
}
}