Объект style в Navigator. JavaScript-стили
Navigator поддерживает прямое обращение по идентификаторам только для объектов layer и не поддерживает коллекцию all. Да и поддержка атрибута ID в нем реализована так себе, в основном, для присвоения элементам стилей. Но объект document Navigator предусматривает четыре очень мощьных свойства для работы со стилями.
Свойство classes позволит вым получить доступ к отдельному поименованному стилю:
document.classes.{Имя стиля}.{Имя тега}|all.{Имя свойства}
Здесь {Имя тега} может быть именем любого тега. Если нужно определить стиль для всех тегов, используйте слово all.
Например, предположим, что вы определили в таблице стилей некий стиль:
.somestyle {color: green}
Тогда в коде скрипта вы можете получить к нему доступ:
document.classes.somestyle.all.fontFamily = "Arial";
Аналогично вы можете определить какой-либо стиль для одного определенного тега:
P.somestyle {color: green}document.classes.somestyle.P.fontFamily = "Arial";
В свою очередь свойство ids позволит вам получить доступ к стилю, присвоенному отдельному идентификатору ID:
document.ids.{Идентификатор}.{Имя свойства}
Например:
#someid {color: green}document.ids.someid.fontFamily = "Arial";
Но что делать, если вы переопределили стиль какого-либо тега? В этом случае воспользуйтесь свойством tags:
document.tags.{тег}.{Имя свойства}
Например:
H1 {color: green}document.tags.H1.fontFamily = "Courier";
А если вам нужно, скажем, изменить стиль элемента , находящегося внутри заголовка второго уровня? Для этого существует свойство contextual:
document.contextual({Контекст 1}[, {Контекст 2}[, ...]]).{Имя свойства}
Тогда для описанного нами случая:
document.contextual(document.tags.H2, document.tags.B).fontStyle= "oblique";
что аналогично заданию в таблице стилей
H2 B {font-style: oblique}
Но если вы думаете, что можете динамически изменять внешний вид элементов страницы в Navigator путем изменения их стилей, вы жестоко ошибаетесь. Реально объект style нужен Navigator только для поддержки нового вида таблиц стилей, так называемых JavaScript-стилей.
JavaScript-стили отличаются от обычных тем, что больше всего похожи на скрипты. Собственно, это и есть скрипты. Давайте рассмотрим два примера: обычной таблицы стилей и таблице JavaScript-стилей:
Это обычная таблица стилей.Теперь преобразуем ее в таблицу JavaScript-стилей: