Способы доступа к стилям
DOM 2 содержит специальный интерфейс CSSStyleDeclaration, который предназначен для описания блоков деклараций CSS. Этот интерфейс используется и для описания содержимого правил CSS, и для описания стилей отдельных элементов дерева документа. Он имеет чрезмерно усложненную, на наш взгляд, структуру и обеспечивает три разных способа доступа к отдельным свойствам CSS, а именно:
чтение и запись свойств, при которых и название свойства, и его значение задаются текстовой строкой согласно правилам CSS;
чтение и запись свойств, при которых название свойства, задается текстовой строкой согласно правилам CSS, а значение является объектом специального типа CSSValue;
чтение и запись свойств, при которых свойство задается соответствующим атрибутом объекта CSSStyleDeclaration, а его значение задается текстовой строкой согласно правилам CSS.
Пусть, например, мы хотим сделать фон тела документа красным. Соответствующие операторы будут выглядеть так:
document.body.style.setProperty("background-color", "red", "");
document.body.style.backgroundColor = "red";
Первый оператор использует имя свойства CSS, а второй - соответствующее свойство объекта document.body.style. Для чтения цвета фона возможны три варианта:
var clr1 = document.body.style.getPropertyValue("background-color");
var clr2 = document.body.style.getPropertyCSSValue("background-color");
var clr3 = document.body.style.backgroundColor;
Здесь clr1 и clr3 получат тип String, а clr2 - тип CSSValue. DOM 2 объявил первые два способа обязательными, а третий (называемый интерфейсом CSS2Properties) - факультативным. Однако, разработчики обозревателей расставили приоритеты иначе: и MSHTML, и Gecko поддерживают именно третий интерфейс. MSHTML этим ограничивается, а Gecko поддерживает свойства и методы CSSStyleDeclaration, но пока не поддерживает CSSValue. Тем не менее мы приводим описание всех интерфейсов DOM, поскольку следующие версии обозревателей, скорее всего, обеспечат их реализацию.
Значение свойства CSS: интерфейс CSSValue
| Поддержка : |  | Не поддерживается. | | |  | Не поддерживается. |
Интерфейс CSSValue соответствует значению одного свойства CSS. Он имеет два свойства:
Свойства интерфейса CSSValue| Свойство | Изменяемое | Модель | Описание |
|---|
| cssText | Да | DOM 2 | Текст значения. | | cssValueType | Нет | DOM 2 | Тип значения. | Свойство cssTextСинтаксис: объект.cssText
Изменяемое: да
Иcключения: SYNTAX_ERR, INVALID_MODIFICATION_ERR, NO_MODIFICATION_ALLOWED_ERR (при записи)
| Поддержка : | | Не поддерживается. | | | | Не поддерживается. |
Свойство cssText позволяет читать и задавать значение свойства в виде строки DOMString. Свойство cssValueTypeСинтаксис: объект.cssValueType
Изменяемое: нет
| Поддержка : | | Не поддерживается. | | | | Не поддерживается. |
Свойство cssValueType возвращает целое число, означающее тип данного значения в соответствии со следующей таблицей: 1 2 3 4 5 6 7 8 8 8 8 | |
*
Обратная связь