javascript檢測瀏覽器是否支持某些方法及屬性

判斷當前瀏覽器是否支持 document.getElementsByClassName，最直接的方法莫過於直接if 了

if ( document.getElementsByClassName ) {

//do something

}

確實可以的，但如果我們當前引入了一個第三方的js , js中聲明瞭 document.getElementsByClassName = 我們不希望的東西，那就歇菜了。

瀏覽器對於原生的方法，調用其toString方法，會返回 'function funName() { [native code] }'的，

如

document.getElementsByClassName.toString() === 'function getElementsByClassName() { [native code] }'

因此，可以通過此特性，用一個正則表達式匹配是否有 ‘{ [native' 這個字段，來判斷方法是否爲原生（即瀏覽器支持）。

var re_native = /^[^{]+\{\s*\[native \w/,

supportGetByClass = re_native.test(document.getElementsByClassName),

supportQuerySelector = re_native.test(document.querySelectorAll);

對於判斷是否支持某些屬性，這個方法是不行的，

我們可以創建一個 element 去做判斷

var div = document.createElement('div'),

//判斷當前瀏覽器是否支持半透明 opacity

supportOpacity =  'opacity' in div.style,

//判斷瀏覽器是否支持 classList 操作方法

supportClassList = 'classList' in div;