Справочник по JavaScript : Объект style : Объект style в Navigator. JavaScript-стили
Материал из Справочник Web-языков
|
Работа для спецов по SugarCRM | |||||||
|
Если:
то мы предлагаем Вам сотрудничество. Наша компания (ООО "Лемарс") занимается внедрением CRM-систем на базе SugarCRM. Мы команда программистов, которые были студентами, фрилансерами, наемными работниками. И вот теперь выросли в компанию. Мы отлично знаем SugarCRM, потому поможем ее освоить. Мы отлично знаем работу программиста, потому в наших с Вами отношениях постараемся уйти от типовых ошибок и выстроить действительно длительные и взаимовыгодные отношения. Если предложение интересно, то пишите о себе в произвольной форме, или звоните (спросить Евгения):
| |||||||
|
Разработка и внедрение CRM-систем | |||||||
|
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";
А если вам нужно, скажем, изменить стиль элемента <B>, находящегося внутри заголовка второго уровня? Для этого существует свойство 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-стилей:
<STYLE type="text/css">
P {color: blue}
.bigtext {font-size: 72pt; font-weight: boldest}
H1 B {text-decoration: underline}
</STYLE>
Это обычная таблица стилей. Теперь преобразуем ее в таблицу JavaScript-стилей:
<STYLE type="text/javascript">
document.tags.P.color = "blue";
width (document.classes.bigtext.all) {
fontSize = "72pt";
fontWeight = "boldest"; }
document.contextual(document.tags.H1, document.tags.B).textDecoration =
"underline";
</STYLE>
Теперь вы видете, как таблица JavaScript-стилей похожа на скрипт. Заметьте также, что в этом случае атрибут type обязателен, т.к. он указвывает тип таблицы стилей.
Во всех предыдущих примерах для Navigator мы всегда приводили ссылку на объект document. Но в таблицах JavaScript-стилей ее можно опустить.
<STYLE type="text/javascript">
tags.P.color = "blue";
width (classes.bigtext.all) {
fontSize = "72pt";
fontWeight = "boldest"; }
contextual(tags.H1, tags.B).textDecoration = "underline";
</STYLE>
