IE與FireFox的兼容性問題分析
更新時(shí)間:2007年04月22日 00:00:00 作者:
window.event
IE:有window.event對(duì)象
FF:沒有window.event對(duì)象??梢酝ㄟ^給函數(shù)的參數(shù)傳遞event對(duì)象。如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)(加上滾動(dòng)條滾過的距離)
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。注意:此時(shí)頁面一定要有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í)行一個(gè)過程,而attachEvent和addEventListener執(zhí)行的是一個(gè)過程列表,也就是多個(gè)過程。例如:element.attachEvent("onclick", func1);element.attachEvent("onclick", func2)這樣func1和func2都會(huì)被執(zhí)行。
標(biāo)簽的自定義屬性
IE:如果給標(biāo)簽div1定義了一個(gè)屬性value,可以div1.value和div1["value"]取得該值。
FF:不能用div1.value和div1["value"]取。
通用:div1.getAttribute("value")。
父節(jié)點(diǎn)、子節(jié)點(diǎn)和刪除節(jié)點(diǎn)
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對(duì)象
FF:沒有window.event對(duì)象??梢酝ㄟ^給函數(shù)的參數(shù)傳遞event對(duì)象。如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)(加上滾動(dòng)條滾過的距離)
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。注意:此時(shí)頁面一定要有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í)行一個(gè)過程,而attachEvent和addEventListener執(zhí)行的是一個(gè)過程列表,也就是多個(gè)過程。例如:element.attachEvent("onclick", func1);element.attachEvent("onclick", func2)這樣func1和func2都會(huì)被執(zhí)行。
標(biāo)簽的自定義屬性
IE:如果給標(biāo)簽div1定義了一個(gè)屬性value,可以div1.value和div1["value"]取得該值。
FF:不能用div1.value和div1["value"]取。
通用:div1.getAttribute("value")。
父節(jié)點(diǎn)、子節(jié)點(diǎn)和刪除節(jié)點(diǎn)
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實(shí)現(xiàn)解析XML文檔與字符串
這篇文章主要介紹了javascript解析XML文檔和XML字符串的方法和具體的代碼解析,有需要的小伙伴可以參考下。2016-03-03JavaScript 浮動(dòng)定位提示效果實(shí)現(xiàn)代碼
本來想做一個(gè)集合浮動(dòng)定位和鼠標(biāo)跟隨的tooltips效果,但發(fā)現(xiàn)定位和鼠標(biāo)跟隨在一些關(guān)鍵的地方還是不同的,還是分開來吧。2009-09-09微信小程序開發(fā)之實(shí)現(xiàn)自定義Toast彈框
Toast相信對(duì)于利用微信小程序開發(fā)的朋友們來說都不陌生,有時(shí)候官方的樣式并不能滿足業(yè)務(wù)要求,怎么辦呢,當(dāng)然有解決辦法了。有一個(gè)插件可以直接幫我們完成WeToast,這篇文章主要給大家介紹了微信小程序開發(fā)之實(shí)現(xiàn)自定義Toast彈框的相關(guān)資料,需要的朋友可以參考下。2017-06-06BootStrap點(diǎn)擊下拉菜單項(xiàng)后顯示一個(gè)新的輸入框?qū)崿F(xiàn)代碼
這篇文章主要介紹了BootStrap點(diǎn)擊下拉菜單項(xiàng)后顯示一個(gè)新的輸入框?qū)崿F(xiàn)代碼的相關(guān)資料,需要的朋友可以參考下2016-05-05JavaScript模擬實(shí)現(xiàn)鍵盤打字效果
這篇文章主要介紹了JavaScript模擬實(shí)現(xiàn)鍵盤打字效果,本文直接給出實(shí)例代碼,需要的朋友可以參考下2015-06-06