사용자 도구

사이트 도구


javascript:css

Javascript CSS 제어

특정 Style 지원 여부 확인

브라우저에서 지원하는 CSS 속성을 가져오면 빈 문자열을 받고, 지원하지 않는 속성을 가져오려고 하면 null 응답을 받게 된다. 다음 처럼 typeof 결과가 “string”인지 확인한다.

var element = document.documentElement;
var style = element.style;
if (style && typeof style.columnCount === "string") {
  // columnCount CSS를 지원할 때 하는 작업
}

Computed Style

  • Computed Style
    function getComputedStyle( dom ) {
        var style;
        var returns = {};
        // FireFox and Chrome way
        if(window.getComputedStyle){
            style = window.getComputedStyle(dom, null);
            for(var i = 0, l = style.length; i < l; i++){
                var prop = style[i];
                var val = style.getPropertyValue(prop);
                returns[prop] = val;
            }
            return returns;
        }
        // IE and Opera way
        if(dom.currentStyle){
            style = dom.currentStyle;
            for(var prop in style){
                returns[prop] = style[prop];
            }
            return returns;
        }
        // Style from style attribute
        if(style = dom.style){
            for(var prop in style){
                if(typeof style[prop] != 'function'){
                    returns[prop] = style[prop];
                }
            }
            return returns;
        }
        return returns;
    };
javascript/css.txt · 마지막으로 수정됨: 2012/09/22 15:00 저자 kwon37xi