JavaScript и CSS. Свойства и методы объекта styleSheet (массив styleSheets)
Доступ к свойствам и методам объекта styleSheet:
document.styleSheets[индекс].свойство/метод([параметры])
Объект styleSheet существует на основе определения таблицы стилей, вложенного в текущий документ или присоединенного из внешнего файла. Доступ к объекту styleSheet осуществляется с помощью массива document.styleSheets.
Свойства
Данное свойство возвращает массив правил таблицы стилей. Их список представляется в порядке их появления в коде.
Содержит строку правил таблицы стилей, заключенных в объекте styleSheet. В тексте, возвращаемом этим свойством, могут присутствовать символы возврата каретки и другие элементы форматирования. CssText можно использовать для того, чтобы заменить все правила таблицы стилей, присвоив их данному свойству, предварительно скомпоновав в виде строки.
Активизация и отключение таблиц стилей - один из способов изменения стилей web-страницы, которая может иметь множество таблиц стилей, которые могут подключаться и отключаться с помощью сценария.
Когда таблица стилей присоединена к документу с помощью элемента LINK, данное свойство содержит строку с url соответствующего файла.В IE4+ для Windows это свойство доступно для чтения и записи, что, соответственно, позволяет присоединять внешний файл таблицы стилей послее того, как web-страница уже загружена.
Наследует свойство id элемента-контейнера. Таким образом, строка id может служить индексом в массиве document.styleSheets.
Таблица стилей может содержать одно и более правил @import для импортирования внешнего файла таблицы стилей в документ. Каждый импортированный объект styleSheet считается объектом import. Таким образом, свойство imports представляет собой массив всех импортированных объектов styleSheet, принадлежащих текущему объекту styleSheet. Необходимо отметить, что импортированные таблицы стилей не добавляются в массив document.styleSheets, поэтому ссылки на импортированные объекты должны задаваться с помощью массива document.styleSheets[i].imports[j]. Объект import является объектом styleSheet, поэтому их свойства и методы аналогичны.
Таблицы стилей могут применяться для работы с такими видами устройств вывода, как экран монитора, принтер, устройств обработки человеческой речи и генераторами Брайля. Такую возможность предоставляет атрибут MEDIA элементов STYLE или LINK. В IE4+ значение свойства media представляет собой строку с одним из трех возможных значений: screen, printer, all. В NN6 значение представляет собой массив строк с названиями определенных устройств вывода.
Правило стиля @page определяет размеры и ширину полей напечатанной версии web-страницы. Свойство pages возвращает массив правил @page, содержащихся в текущем объекте styleSheet.
Булево значение данного свойства позволяеь сценарию определить, была ли текущая таблица стилей подключена к документу с помощью элемента style (значение readOnly - false) или импортироана из внешнего файла с помощью элемента LINK или правила @import (значение readOnly - true).
Возвращает массив всех правил, определенных в текущей таблице стилей. Порядок следования объектов правил в массиве соответствует порядку расположения правил, определенных в элементе STYLE внешнего файла в исходном коде. Данный массив предпочтительнее использовать для ссылки на индивидуальное правило, определенное в данной таблице стилей. Соответствующее свойство в NN6 носит название cssRules.
При задании значения атрибуту TITLE элемента STYLE или LINK оно преобразуется в свойство title объекта styleSheet. Строковое значение может служить идентификатором, но оно не может быть использовано в качестве индекса массива styleSheets.
Свойство type имеет непосредственное отношение к атрибуту TYPE элементов STYLE или LINK, с помощью которых таблица стилей вложена в документ (имеет значение text/css).
Методы
Позволяет добавить правило @import к объекту styleSheet. Первый параметр - URL внешнего css-файла. Если не указывать второй параметр, правило @import будет добавлено в конец массива styleSheets. Порядок следоания правил в объекте styleSheet может повлиять на порядок какскадного включения перекрывающих друг друга правил таблиц стилей. Значение, которое возвращает метод, является индексом места расположения нового правила в массиве правил объекта styleSheet.
Метод addRule присоединяет или вставляет правило таблицы стилей в текущий объект styleSheet. Первые два параметра представляют собой строки двух компонентов куаждого правила: селектор и спецификация стиля. Допустимо использовать любой действительный селектор, включая множественные селекторы, селекторы с разделителями. Строка спецификации стиля содержит список пар атрибут:значение, разделенных точками с запятой, без фигурных скобок. Если опустить последний параметр, правило будет присоединено в конце массива правил rules. Возвращаемое значение значащей информации не несет. Для того, чтобы удалить правило из массива rules используется метод removeRule(). Соответствующие методы в NN6 называются insertRule() и deleteRule().
Первый параметр метода insertRuleпредставляет собой строку, содержащую правило стиля в том виде, в котором оно обычно представляется в таблице стилей, включая селектор и фигурные скобки. Место вставки правила определяется индексом, если же Вы хотите добавить его в конце массива необходимо использовать свойство дурпер массива cssRules. Возвращаемое значение - индекс места расположения нового правила. Для удаления правила из массива cssRules используется метод метод deleteRule(). Значения не возвращает. Соответствующие методы в IE4+ называются addRule() и removeRule().