Как прочитать неподдерживаемые свойства CSS браузера?

Question

Совершенно случайно сегодня я обнаружил, что в IE6, IE7 и IE8 можно читать неподдерживаемые свойства CSS с помощью метода jQuery .css ():

jQuery(node).css('transition');   // Returns the transition value 

Это позволило мне добавитьоткат анимации для переходов CSS3 в эти браузеры в моем плагине jQuery jquery.transitions ( github.com / stephband / jquery.transitions ).Радость.

Вопрос: можно ли читать неподдерживаемые свойства CSS в других браузерах?Мои начальные тесты с использованием вышеупомянутого метода в FF3.6 и IE9 были бесплодными.Есть ли другой способ, кроме анализа таблиц стилей?

Answer 1

Спецификация DOM Level 2 Style 2000 года предусматривала программный доступ к правилам, которые пользовательский агент не понимал. Я написал ответ о старой спецификации, и в одном из комментариев упоминается ошибка , поданная в Mozilla для ее реализации.

Однако ни один из поставщиков браузеров не реализовал эту функцию. Итак, в последней спецификации w3 вообще убрал эту функцию. Вы можете найти ветку обсуждения с просьбой повторно реализовать эту функцию в спецификации, но это было в 2009 году, а сейчас 2011 год, и w3, похоже, не заинтересован в его добавлении.

То есть технически IE соответствовал спецификации до появления новой:)

Answer 2

Я не уверен, что этот метод будет работать слишком хорошо в большинстве браузеров - как говорит @BoltClock, это не то, чем должен заниматься браузер, поэтому похоже, что вам просто повезло с IE.

Если бы я хотел предоставить такие резервные функции, я бы использовал Modernizr , чтобы определить, какие функции отсутствовали.

Answer 3

Для IE9:

После некоторого тестирования я сделал еще одно открытие.

Хотя 'transition' не является поддерживаемым свойством в IE9, он ДОЛЖЕН отображаться в document.stylesheets [n] .cssRules [n] .cssText, в отличие от других браузеров, и в конечном итоге отображается как getComputedStyle (node) .transition. , Это означает, что читать это легко. Двойная радость!

Интересно, и, вероятно, бесполезно, что все префиксные правила также отображаются - так что вы можете прочитать -moz- и -webkit- префиксные правила в вашем JavaScript.

Для FF3.6 / WebKit

Нет таких приемов для FF3.6 или ниже или WebKit, хотя я не слишком беспокоюсь. Я считаю, что освоение FF4 будет довольно быстрым.

Answer 4

В IE9 я обнаружил, что getComputedStyle не работает надежно для всех неподдерживаемых свойств, в то время как это делает:

element.currentStyle.getAttribute('-some-test')