IE與FireFox的兼容性問題分析
更新時間:2007年04月22日 00:00:00 作者:
window.event
IE:有window.event對象
FF:沒有window.event對象??梢酝ㄟ^給函數(shù)的參數(shù)傳遞event對象。如onmousemove=doMouseMove(event)
鼠標(biāo)當(dāng)前坐標(biāo)
IE:event.x和event.y。
FF:event.pageX和event.pageY。
通用:兩者都有event.clientX和event.clientY屬性。
鼠標(biāo)當(dāng)前坐標(biāo)(加上滾動條滾過的距離)
IE:event.offsetX和event.offsetY。
FF:event.layerX和event.layerY。
標(biāo)簽的x和y的坐標(biāo)位置:style.posLeft 和 style.posTop
IE:有。
FF:沒有。
通用:object.offsetLeft 和 object.offsetTop。
窗體的高度和寬度
IE:document.body.offsetWidth和document.body.offsetHeight。注意:此時頁面一定要有body標(biāo)簽。
FF:window.innerWidth和window.innerHegiht,以及document.documentElement.clientWidth和document.documentElement.clientHeight。
通用:document.body.clientWidth和document.body.clientHeight。
添加事件
IE:element.attachEvent("onclick", func);。
FF:element.addEventListener("click", func, true)。
通用:element.onclick=func。雖然都可以使用onclick事件,但是onclick和上面兩種方法的效果是不一樣的,onclick只有執(zhí)行一個過程,而attachEvent和addEventListener執(zhí)行的是一個過程列表,也就是多個過程。例如:element.attachEvent("onclick", func1);element.attachEvent("onclick", func2)這樣func1和func2都會被執(zhí)行。
標(biāo)簽的自定義屬性
IE:如果給標(biāo)簽div1定義了一個屬性value,可以div1.value和div1["value"]取得該值。
FF:不能用div1.value和div1["value"]取。
通用:div1.getAttribute("value")。
父節(jié)點、子節(jié)點和刪除節(jié)點
IE:parentElement、parement.children,element.romoveNode(true)。
FF:parentNode、parentNode.childNodes,node.parentNode.removeChild(node)。
畫圖
IE:VML。
FF:SVG。
CSS:透明
IE:filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=60)。
FF:opacity:0.6。
CSS:圓角
IE:不支持圓角。
FF:-moz-border-radius:4px,或者-moz-border-radius-topleft:4px;-moz-border-radius-topright:4px;-moz-border-radius-bottomleft:4px;-moz-border-radius-bottomright:4px;。
CSS:雙線凹凸邊框
IE:border:2px outset;。
FF:-moz-border-top-colors: #d4d0c8 white;-moz-border-left-colors: #d4d0c8 white;-moz-border-right-colors:#404040 #808080;-moz-border-bottom-colors:#404040 #808080;。
IE:有window.event對象
FF:沒有window.event對象??梢酝ㄟ^給函數(shù)的參數(shù)傳遞event對象。如onmousemove=doMouseMove(event)
鼠標(biāo)當(dāng)前坐標(biāo)
IE:event.x和event.y。
FF:event.pageX和event.pageY。
通用:兩者都有event.clientX和event.clientY屬性。
鼠標(biāo)當(dāng)前坐標(biāo)(加上滾動條滾過的距離)
IE:event.offsetX和event.offsetY。
FF:event.layerX和event.layerY。
標(biāo)簽的x和y的坐標(biāo)位置:style.posLeft 和 style.posTop
IE:有。
FF:沒有。
通用:object.offsetLeft 和 object.offsetTop。
窗體的高度和寬度
IE:document.body.offsetWidth和document.body.offsetHeight。注意:此時頁面一定要有body標(biāo)簽。
FF:window.innerWidth和window.innerHegiht,以及document.documentElement.clientWidth和document.documentElement.clientHeight。
通用:document.body.clientWidth和document.body.clientHeight。
添加事件
IE:element.attachEvent("onclick", func);。
FF:element.addEventListener("click", func, true)。
通用:element.onclick=func。雖然都可以使用onclick事件,但是onclick和上面兩種方法的效果是不一樣的,onclick只有執(zhí)行一個過程,而attachEvent和addEventListener執(zhí)行的是一個過程列表,也就是多個過程。例如:element.attachEvent("onclick", func1);element.attachEvent("onclick", func2)這樣func1和func2都會被執(zhí)行。
標(biāo)簽的自定義屬性
IE:如果給標(biāo)簽div1定義了一個屬性value,可以div1.value和div1["value"]取得該值。
FF:不能用div1.value和div1["value"]取。
通用:div1.getAttribute("value")。
父節(jié)點、子節(jié)點和刪除節(jié)點
IE:parentElement、parement.children,element.romoveNode(true)。
FF:parentNode、parentNode.childNodes,node.parentNode.removeChild(node)。
畫圖
IE:VML。
FF:SVG。
CSS:透明
IE:filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=60)。
FF:opacity:0.6。
CSS:圓角
IE:不支持圓角。
FF:-moz-border-radius:4px,或者-moz-border-radius-topleft:4px;-moz-border-radius-topright:4px;-moz-border-radius-bottomleft:4px;-moz-border-radius-bottomright:4px;。
CSS:雙線凹凸邊框
IE:border:2px outset;。
FF:-moz-border-top-colors: #d4d0c8 white;-moz-border-left-colors: #d4d0c8 white;-moz-border-right-colors:#404040 #808080;-moz-border-bottom-colors:#404040 #808080;。
相關(guān)文章
JavaScript與jQuery實現(xiàn)的閃爍輸入效果
這篇文章主要介紹了JavaScript與jQuery實現(xiàn)的閃爍輸入效果,結(jié)合實例形式分別分析了JavaScript與jQuery實現(xiàn)閃爍輸入效果的方法與具體使用技巧,需要的朋友可以參考下2016-02-02
js實現(xiàn)卡片式項目管理界面UI設(shè)計效果
這篇文章主要介紹了js實現(xiàn)卡片式項目管理界面UI設(shè)計效果,該UI設(shè)計中,將各個項目以卡片的方式堆疊排列在屏幕上,當(dāng)點擊了其中的某個項目的時候,該項目圖片會全屏放大,向下滾動鼠標(biāo)可以看到該項目的介紹信息,需要的朋友可以參考下2015-12-12
JS驗證輸入的是否是數(shù)字及保留幾位小數(shù)問題
這篇文章主要介紹了JS驗證輸入的是否是數(shù)字及保留幾位小數(shù)問題,非常不錯,具有一定的參考借鑒價值,需要的朋友參考下吧2018-05-05
JS如何實現(xiàn)網(wǎng)站中PC端和手機(jī)端自動識別并跳轉(zhuǎn)對應(yīng)的代碼
這篇文章主要介紹了JS如何實現(xiàn)網(wǎng)站中PC端和手機(jī)端自動識別并跳轉(zhuǎn)對應(yīng)的代碼,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-01-01

