2011-04-19 86 views
3

過去我們使用瀏覽器嗅探來推斷某些事件或功能是否可用。我明白,瀏覽器嗅探已被'棄用'或'迴避',以支持功能嗅探。我想知道如何檢查某個事件是否可以處理。如何檢查瀏覽器對功能/事件的支持?

DOMNodeInserted爲例。它受Chrome,FF和Safari支持,但不支持IE。如果此事件可用,我該如何嗅探?有圖書館嗎?你們如何做適當的功能嗅探?

回答

5

不能檢測突變事件,並Modernizr的不適合這個工作(因爲人們會吐出了這一點作爲事實上的答案)。

「檢測」對突變事件的支持的唯一方法是嘗試並觸發事件。僞代碼:

var div = document.createElement('div'), supported = false; 
div.addEventListener('DOMNodeInserted', function(){ supported = true; }); 
div.appendChild(div.cloneNode(true)); 

注意,上面的代碼將無法正常工作,就是如果它在直線代碼,因爲事件偵聽器是異步。總體思路是有效的,但是,也許最好用回調來實現。

+2

對於一般的良好答案+1,但DOM突變事件在所有瀏覽器中都不是異步的。據我所知,唯一的情況是它們在WebKit的可編輯內容中是異步的(儘管這可能會改變)。例如,在Firefox 4中嘗試以下內容:'var div = document.createElement('div'),a =「sync」; div.addEventListener('DOMNodeInserted',function(){console.log(「Inserted」+ a);},false); div.appendChild(使用document.createElement( 「BR」)); a =「async」;'另外,您的代碼在WebKit中不起作用:您似乎需要將div添加到文檔中才能觸發事件。 – 2011-04-19 09:14:02

+0

@Tim所以我們註定要做瀏覽器嗅探? – 2011-04-19 10:36:54

+0

@vwolved「(...)也許最好用回調實現」。我如何檢測永不會觸發的事件?設置'超時'或什麼的? – 2011-04-19 10:40:12

0

要回答這個通用 - 我該如何做特徵嗅探 - 我使用jQuery.support對象。

+0

我似乎沒有找到'DOMNodeInserted'的支持。 – 2011-04-19 10:38:01

+0

@ Kees,這是特定的。我只有一個通用的答案。 – Andrew 2011-05-04 16:05:23

相關問題