Как получить значение каскадного стиля или определить, вычислялось ли фактическое значение?

Мне нужно получить каскадное значение стиля элемента (не вычисленного) или определить, было ли вычислялось фактическое значение или нет.

Например, если у меня есть элемент с css rule width: 100%, я хочу получить значение 100%, а не фактическое значение пикселя, или просто знать, что вычислялось фактическое значение.

Я знаю, что могу получить его с помощью elem.currentStyle, и я также нашел способ в Chrome найти его с помощью document.defaultView.getMatchedCSSRules().

Кто-нибудь знает способ получить его в других браузерах?

Ответ 1

Как рассчитать стоимость самостоятельно? Запросить расчетную ширину искомого элемента и вычисленную ширину у родительского элемента, а затем выполнить некоторую математику, чтобы получить процентное значение? percentageValue = 100% * widthOfWanted / widthOfContainer

Ответ 2

В этот момент я не думаю, что есть встроенный способ сделать это в браузерах, отличных от IE: getComputedStyle всегда будет просто возвращать использованное значение для этих свойств, как вы сказали.

Ответ 3

//Аргумент css в этом примере должен быть строкой типа css, а не строкой camelCase.

function deepCss(who, css, ps){
    var sty, dv= document.defaultView;
    // IE8 and below
    if(document.body.currentStyle){
        sty= css.replace( /\-([a-z])/g, function(a, b){
            return b.toUpperCase();
        });
        return who.currentStyle[sty];
    }
    // everyone else
    if(dv){
        dv= document.defaultView.getComputedStyle(who, ps);
        return dv.getPropertyValue(css);
    }
    return '';
}

deepCss (document.body, 'background-color')

Ответ 4

Лучшим маршрутом будет использование библиотеки api-indepent api, такой как jQuery

$(element).css('width') // jquery has a single function that returns a consistent value no matter which browser is in use.