相容IE8以下的辦法 跨瀏覽器處理事件

2021-09-10 07:36:41 字數 1600 閱讀 5202

寫js最常見的場景就是不斷相容各個版本的瀏覽器了。其中,又以ie系列最讓人心塞,雖然jquery在早期解決了額不少麻煩,但是隨著近期jquery逐漸淡出,那麼原生的相容方法就比較重要了。

眾所周知,ie8是乙個分水嶺,除了ie8及其以下的瀏覽器意外,chrome、firefox都基本支援以addeventlistener方法來註冊事件,以removeeventlistener來解除事件。

然而,在ie8以下卻不能這樣,註冊事件是用attachevent,而解除事件則是用detachevent,因此,有相當比較舊的專案在維護或新增功能時,就不得不自己寫一套相容的事件處理**了,參照:

var eventutil =

else

if(element.attachevent)

else},

removehandler:

function

(element,type,handler)

else

if(element.detachevent)

else

}}

另外,由於在事件註冊中,我們最常使用到的就是event物件,而這個物件在ie8以下的瀏覽器中,獲取的方法和主流瀏覽器略有不同,因此也可以一併寫到整個跨瀏覽器處理事件中:

gettarget:

function

(event)

,

addeventlistener中,另乙個常用的技巧是冒泡機制以及對瀏覽器元素預設行為的控制,這兩個行為在也是以ie8為分水嶺分成了兩種**,因此也需要做相容處理:

(一)阻止冒泡:

stoppropagation:

function

(event)

else

}

(二)取消預設行為:
preventdefault:

function

(event)

else

}

關於整個js時間的跨瀏覽器處理,可以抽象成乙個物件來封裝,最後的**如下:

var eventutil =

else

if(element.attachevent)

else},

removehandler:

function

(element, type, handler)

else

if(element.detachevent)

else},

gettarget:

function

(event)

, preventdefault:

function

(event)

else},

stoppropagation:

function

(event)

else

}

相容ie8 如何回答 瀏覽器相容

如何機智地回答瀏覽器相容性問題 掘金 同乙份 在各瀏覽器上顯示效果正常,有些不正常 1 要不要做 2 做到什麼程度 3 如何做 貼乙個方方老師對postcss的經典回答 各位前端大神能不能通俗的說一下postcss到底能做什麼?對於手寫css的優勢在哪?www.zhihu.com 4 漸進增強和優雅...

web開發 IE8瀏覽器相容rgba

1.問題 實現乙個背景透明的效果,用css3用rgba 就能實現,相容到ie8,沒有透明效果,因為ie8不支援rgba 函式。background rgba 0,0,0,5 2.rgba 函式 rgba的含義,r代表red,g代表green,b代表blue,a代表透明度。紅綠藍是三原色,所有顏色都可...

讓Bootstrap 3相容IE8瀏覽器

看到這篇文章有越來越多的人看,我決定給大家節省時間,廢話少說。有幾個點大家要注意。1 本地除錯需要web server 如iis apache,nginx 單純地本地開啟檔案不能看到相容效果。2 如果你發現已經引用了respond.js和bootstrap,仍無效果,請檢視你的bootstrap是否...