javascript - 使用 javascript 获取 CSS Transitions 的 vendor 前缀有什么问题？

Question

我不仅想检测转换支持，还想通过一次函数调用设置正确的前缀。这样做会有什么明显的问题吗？

function getTransitionPrefix() {
var el = document.getElementsByTagName("body")[0],
cssDec = (typeof window.getComputedStyle === "undefined") ?  {} : window.getComputedStyle(el,null),
transition = typeof cssDec.WebkitTransition !== "undefined" ? "Webkit" : 
typeof cssDec.MozTransition !== "undefined"  ? "Moz":
typeof cssDec.msTransition !== "undefined" ? "ms" :
typeof cssDec.OTransition !== "undefined" ? "O" : false;
return transition;
}

Answer 1

我没有看到任何错误，但我可能会这样做:

function getTransitionPrefix() {
    var el = document.createElement( "div" ),
        prefixes = ["Webkit", "Moz", "O", "ms"];
    for ( var i = 0; i < prefixes.length; i++ ) {
        if ( prefixes[i] + "Transition" in el.style ) {
            return prefixes[i];
        }
    }
    return "transition" in el.style ? "" : false;
}

然后设置过渡:

var setTransition = (function() {
    var pref = getTransitionPrefix();
    return function( elem, trans ) {
        if ( pref !== false ) {
            var s = pref === "" ? "transition" : pref + "Transition";
            elem.style[s] = trans;
        }
    };
})();

setTransition( element, "transition settings" );