事件绑定3

获取事件中那个主对象旁边的离得最近相关对象
w3c标准

addEvent(window,'load',function()
{
    var spanDom=document.getElementById('box');
    
    addEvent(spanDom,'mouseover',function(e)
    {
        alert(e.relatedTarget);
    }
    );
}

);

ie标准的方法

ie标准的相关对象，鼠标移入mouseover 必须对应fromElement()鼠标移出mouseout 必须对应toElement()

addEvent(window,'load',function()
{
    var spanDom=document.getElementById('box');
    
    addEvent(spanDom,'mouseout',function(e)
    {
        alert(window.event.toElement);
    }
    );
}

);

两款浏览器兼容性解决

//两款浏览器兼容性解决
function getRelatedElement(e){
    
    var e=e.relatedTarget||window.event;
    if(e.srcElement)
    {
        if(e.type=='mouseover')
        return e.fromElement;
        if(e.type=='mouseout')
        {
           return e.toElement; 
        }
        
        
    }
    else if(e.relatedTarget)
    {
        return e.relatedTarget;
    }
    
}

用传统方式阻止浏览器默认行为

addEvent(window,'load',function()
{
    var a=document.getElementsByTagName('a')[0];
    a.onclick=function(){
        alert('qwe');
        return false;
        };
    }
);

w3c阻止默认行为

addEvent(window,'load',function()
{
    var a=document.getElementsByTagName('a')[0];
   addEvent(a,'click',function(e){
       
     e.preventDefault();
     alert('qaaa');
       
   });
    
    }
);

阻止默认行为的兼容

//阻止默认行为的兼容
function preventDft(e)
{
    var e=e||window.event;
    if(e.preventDefault)
      e.preventDefault();
      else 
      e.returnValue=false;
}

上下文菜单事件

addEvent(window,'load',function()
{
    var t=document.getElementsByTagName('textarea')[0];
   addEvent(t,'contextmenu',function(e){
       preventDft(e);
       
       var menu=document.getElementById('menu');
       menu.style.display='block';
       menu.style.left=e.clientX+'px';
      menu.style.top=e.clientY+'px'; 
       
       
     });
     }
);

卸载前事件，关于离开当前页面的事件

addEvent(window,'beforeunload',function(e)
{
    preventDft();

});

关于鼠标滚轮事件

//对于非火狐浏览器
addEvent(document,'mousewheel',function(e)
{
    alert(e.wheelDelta);//滚轮滚动度数

});
//对于火狐浏览器

addEvent(document,'DOMMouseScroll',function(e)
{
    alert(e.detail);//滚轮滚动度数

});

DOMContentLoaded readystatechange两个事件关于加载性能