不管我們對瀏覽器類型前綴有多麽的討厭，我們都不得不每天面對它，否者有些東西不能正常工作。這些前綴的用法有兩種：在CSS裏(例如“-moz-”)和在JS裏。有一個神奇的X-Tag項目裏有一段很聰明的JavaScript腳本，可以用來判斷當前使用的是什麽前綴——讓我來展示它是如何工作的！

該函數返回的對象大概會是這個樣子

Object {dom: "WebKit", lowercase: "webkit", css: "-webkit-", js: "Webkit"}

var styles = window.getComputedStyle(document.documentElement, "");

// 下一步是把這些屬性轉換成數組對象，搜索已知的前綴類型，如果沒有發現，就缺省設置為Opera瀏覽器：
var pre = (Array.prototype.slice.call(styles).join("").match(/-(moz|webkit|ms)-/) || (styles.OLink === ‘‘ && [‘‘, ‘o‘]))[1];
// 它完整的表達了當前瀏覽器裏使用的類型前綴的信息。下面是完整的代碼：
var prefix = (function(){
    var styles = window.getComputedStyle(document.documentElement, "");
    var pre = (Array.prototype.slice.call(styles).join("").match(/-(moz|webkit|ms)-/) || (styles.OLink === ‘‘ && [‘‘, ‘o‘]))[1];
    var dom = ("WebKit|Moz|MS|O").match(new RegExp(‘(‘ + pre + ‘)‘, ‘i‘))[1];
    return {
        dom: dom,
        lowercase: pre,
        css: "-" + pre + "-",
        js: pre[0].toUpperCase() + pre.substr(1)
    }
}());
console.log(prefix);    // {dom: "WebKit", lowercase: "webkit", css: "-webkit-", js: "Webkit"}

從HTML元素上獲取CSS樣式信息是明智的做法。這個方法假設了這些樣式裏一定有類型前綴信息，但是事實未必這樣，不過至少很長時間內這種方法還是好用的。

瀏覽器類型前綴