Получить все стили CSS элемента с JavaScript

Question

Есть ли способ выбрать все правила CSS элемента с JavaScript? Я не ищу конкретного решения, пока все CSS-правила данного элемента будут прочитаны.

Итак, у меня есть следующий HTML

<div class='styledDiv' style='height:100px;width:100px;'></div> 

, а затем в отдельном CSS файле:

.styledDiv 
{ 
    background-color: #ccc; 
    border: solid 5px blue; 
} 

Я хотел бы конечный результат, чтобы включить все встроенные и отдельные правила файла CSS. Неважно, в каком формате конечный результат, будь то строка или массив, что угодно.

Позвольте мне также упомянуть, я просмотрел код, который читает CSS-правила из отдельного файла CSS. Я думаю, что может быть лучшее решение. Кроме того, FireFox и Chrome позволяют прокручивать свойство .style так же, как и цикл через массив. Тем не менее, FF выплескивает - * tl-исходные правила для правой и левой границы/поля/заполнения и не отображает фактические значения CSS. Решение с использованием jQuery также отлично.

Answer 1

Для FireFox, вы можете использовать это: https://developer.mozilla.org/en/DOM:window.getComputedStyle

Для IE, вы можете использовать это: http://msdn.microsoft.com/en-us/library/ms535231(VS.85).aspx

Помните! Ты шагаешь по темным водам здесь.

Эти результаты возвращают интерпретацию CSS браузером. Например, при получении цветов IE вернет HEX цветовые коды, а Firefox возвращает код rbg. И для размеров шрифтов IE вернет фактический унаследованный размер шрифта, в то время как Firefox вернет pt.

Answer 2

Я думаю, что эта ссылка может помочь вам:

http://developer.apple.com/internet/webcontent/styles.html