大量Firefox和IE不兼容的javascript代码: runtimeStyle, event.srcElement

编写EasyCluster 1.6的mainleft的时候,遭遇了大量Firefox和IE不一样的js代码,如runtimeStyle, event.srcElement, parentElement, attachEvent。这些都是IE中管用的,在Firefox中要换成style, event.target, parentNode, addEventListener。Firefox中runtimeStyle和parentElement是没有的,而IE中style, runtimeStyle, parentElement, parentNode都是有的。

具体看下面的代码,下面的代码很简单,就是给所有的tr(除了id为roottr的)加上onmouseover, onmouseout事件(鼠标移入和移出的时候加背景和改变光标):

     < script language = " javascript " >
    
//  process tr backgrounds and cursor
     var  trarray, i, normalColor;
    trarray 
=  document.getElementsByTagName( " tr " );
    
<%
        
//  firefox or IE?
        String useragent  =  request.getHeader( " user-agent " );
        
if  (useragent.indexOf( " Firefox " ==   - 1 ) {
    
%>
    
for  (i = 0 ; i < trarray.length; i ++ ) {
        
if  (trarray[i].id  !=   " roottr " ) {
            trarray[i].attachEvent(
" onmouseover " , ProcessMouseOver);
            trarray[i].attachEvent(
" onmouseout " , ProcessMouseOut);
        }
    }

    
function  ProcessMouseOver(event)
    {
        
if  (event.srcElement.tagName.toLowerCase()  ==   " td " ) {
            normalColor 
=  event.srcElement.parentElement.style.backgroundColor; 
            event.srcElement.parentElement.runtimeStyle.backgroundColor  
=   " #F7D12A " ;
            event.srcElement.parentElement.runtimeStyle.cursor 
=   " pointer " ;
        }
        
if  (event.srcElement.tagName.toLowerCase()  ==   " a "   ||  event.srcElement.tagName.toLowerCase()  ==   " img " ) {
            normalColor 
=  event.srcElement.parentElement.parentElement.style.backgroundColor; 
            event.srcElement.parentElement.parentElement.runtimeStyle.backgroundColor  
=   " #F7D12A " ;
            event.srcElement.parentElement.parentElement.runtimeStyle.cursor 
=   " pointer " ;
        }

    }

    
function  ProcessMouseOut(event)
    {
        
if  (event.srcElement.tagName.toLowerCase()  ==   " td " ) {
            event.srcElement.parentElement.runtimeStyle.backgroundColor  
=  normalColor;
            event.srcElement.parentElement.runtimeStyle.cursor 
=   "" ;
        }
        
if  (event.srcElement.tagName.toLowerCase()  ==   " a "   ||  event.srcElement.tagName.toLowerCase()  ==   " img " ) {
            event.srcElement.parentElement.parentElement.runtimeStyle.backgroundColor  
=  normalColor;
            event.srcElement.parentElement.parentElement.runtimeStyle.cursor 
=   "" ;
        }
    }
    
<%
        } 
else  {
    
%>
    
for  (i = 0 ; i < trarray.length; i ++ ) {
        
if  (trarray[i].id  !=   " roottr " ) {
            trarray[i].addEventListener(
" mouseover " , ProcessMouseOver,  false );
            trarray[i].addEventListener(
" mouseout " , ProcessMouseOut,  false );
        }
    }

    
function  ProcessMouseOver(event)
    {
        
if  (event.target.tagName.toLowerCase()  ==   " td " ) {
            normalColor 
=  event.target.parentNode.style.backgroundColor; 
            event.target.parentNode.style.backgroundColor  
=   " #F7D12A " ;
            event.target.parentNode.style.cursor 
=   " pointer " ;
        }
        
if  (event.target.tagName.toLowerCase()  ==   " a "   ||  event.target.tagName.toLowerCase()  ==   " img " ) {
            normalColor 
=  event.target.parentNode.parentNode.style.backgroundColor; 
            event.target.parentNode.parentNode.style.backgroundColor  
=   " #F7D12A " ;
            event.target.parentNode.parentNode.style.cursor 
=   " pointer " ;
        }

    }

    
function  ProcessMouseOut(event)
    {
        
if  (event.target.tagName.toLowerCase()  ==   " td " ) {
            event.target.parentNode.style.backgroundColor  
=  normalColor;
            event.target.parentNode.style.cursor 
=   "" ;
        }
        
if  (event.target.tagName.toLowerCase()  ==   " a "   ||  event.target.tagName.toLowerCase()  ==   " img " ) {
            event.target.parentNode.parentNode.style.backgroundColor  
=  normalColor;
            event.target.parentNode.parentNode.style.cursor 
=   "" ;
        }
    }
    
<%
        }
    
%>
    
< / script>

转载于:https://www.cnblogs.com/super119/archive/2011/03/20/1989359.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值