Связь и интернет Архив Программирование
   
Сделать стартовойСделать закладку            
   ПОИСК  
   
Главная / DHTML /
8  Perl
8  PHP
8  JavaScript
8  HTML
8  DHTML
8  XML
8  CSS
8  C / C++
8  Pascal и Delphi
8  Турбо Ассемблер
8  MySQL
8  CASE-технологии
8  Алгоритмы
8  Python
8  Обратная связь
8  Гостевая книга
Новости о мире


Динамические таблицы стилей - Программирование от RIN.RU
Динамические таблицы стилей



Таблицы стилей CSS: интерфейс CSSStyleSheet


Поддержка :Нестандартная, только для HTML-документов.
Соответствует стандарту.



Интерфейс CSSStyleSheet соответствует одной таблице стилей на языке CSS. Он является производным от интерфейса StyleSheet и имеет следующие дополнительные свойства и методы:


Свойства интерфейса CSSStyleSheet
СвойствоИзменяемоеМодельОписание
cssRulesНетDOM 2Коллекция операторов таблицы.
ownerRuleНетDOM 2Директива, которой импортирована данная таблица.



Методы интерфейса CSSStyleSheet
МетодМодельОписание
deleteRuleDOM 2Удаляет заданное правило из таблицы.
insertRuleDOM 2Вставляет новое правило в таблицу.



Свойство cssRules


Синтаксис:  объект.cssRules
Изменяемое: нет


Поддержка :Под названием rules.
Соответствует стандарту.



Свойство cssRules возвращает объект CSSRuleList, содержащий список всех операторов данной таблицы стилей. Пример:



alert(document.styleSheets[0].cssRules[0].cssText);





В Internet Explorer это свойство называется rules и возвращает коллекцию всех правил таблицы, т. е. директивы в нее не включаются:



alert(document.styleSheets[0].rules[0].style.cssText);





Свойство ownerRule


Синтаксис:  объект.ownerRule
Изменяемое: нет


Поддержка :Не поддерживается.
Соответствует стандарту.



Если данная таблица стилей импортирована директивой @import, то свойство ownerRule возвращает объект CSSImportRule, соответствующий этой директиве. В этом случае свойство таблицы ownerNode равно null. В остальных случаях данное свойство возвращает null. Пример:



var imported = document.styleSheets[0].ownerRule != null;
var external = document.styleSheets[0].ownerNode.tagName == "link";
var sstype = (imported ? "импортированная" : (external ? "внешняя" : "внутренняя"));
alert(sstype + " таблица");





Internet Explorer это свойство не поддерживает. Вместо него таблицы содержат нестандартное свойство imports, которое возвращает коллекцию всех таблиц, импортированных данной таблицей, и метод addImport(URL, index), добавляющий таблицу с заданным URL в эту коллекцию (аргумент index следует тем же правилам, что и в методе addRule).


Метод deleteRule


Синтаксис:  объект.deleteRule(index)
Аргументы: index - числовое выражение
Исключения: INDEX_SIZE_ERR, NO_MODIFICATION_ALLOWED_ERR


Поддержка :Под названием removeRule.
Соответствует стандарту.



Метод deleteRule удаляет правило с номером index из коллекции cssRules. Индекс должен лежать в диапазоне от 0 до cssRules.length-1 включительно. Пример:



document.styleSheets[0].deleteRule(0);





В Internet Explorer этот метод называется removeRule и аргумент index в нем может быть опущен; в этом случае удаляется первое правило коллекции:



document.styleSheets[0].removeRule();





Метод insertRule


Синтаксис:  объект.insertRule(rule, index)
Аргументы: rule - выражение типа DOMString
index - числовое выражение
Исключения: HIERARCHY_REQUEST_ERR, INDEX_SIZE_ERR, NO_MODIFICATION_ALLOWED_ERR, SYNTAX_ERR


Поддержка :Под названием addRule.
Соответствует стандарту.



Метод insertRule вставляет новое правило в коллекцию cssRules перед правилом с номером index. Текст правила, включая селектор и декларацию, задается аргументом rule. Индекс должен лежать в диапазоне от 0 до cssRules.length; если он равен cssRules.length, то новое правило добавляется в конец коллекции. Пример:



document.styleSheets[0].insertRule("BODY { color: red }", 0);





В Internet Explorer этот метод называется addRule и имеет вид addRule(selector, style, index),
где selector - текст селектора, style - текст декларации свойств, а index - позиция вставки нового правила. Если аргумент index опущен, то правило добавляется в конец коллекции. Пример:



document.styleSheets[0].addRule("BODY", "color: red", 0);



<<<  Назад
 1  2  3  4  5  6  7 


 8  Комментарии к статье  8 8  Обсудить в чате

 
  
  
    Copyright ©  RIN 2003 - 2004      * Обратная связь