Лекция: Свойства и методы объекта style
Объект style поддерживает ряд свойств и методов. Их можно разделить на две группы: задающие стиль документа и относящиеся к самому объекту style. Свойства первой группы аналогичны соответствующим атрибутам стиля и имеют почти такие же имена. Вместе с тем, символы "-" убираются, т.к. не соответстуют соглашению об именах JavaScript, а первые буквы всех слов, образующих имя атрибута, кроме первого, делаются прописными. Покажем примеры преобразования имен атрибутов стиля в имена свойств объекта style, устанавливающих стиль элемента: background-attachment-> backgroundAttachment;
border-bottom-color-> borderBottomColor; font-family ->fontFamily; z-index ->zIndex.
По аналогии можно преобразовать все атрибуты стилей в свойства объекта style. Все не относящееся к стилю свойства объекта style перечислены в таблице.
| Свойство | Описание |
| cssText | текстовое представление стиля (параметр атибута STYLE). |
| pixelHeight | Высота элемента в пикселах. |
| pixelLeft | Смещение левого края элемента в пикселах. |
| pixelTop | Смещение верхнего края элемента в пикселах. |
| pixelWidth | Ширина элемента в пикселах. |
| posHeight | Высота элемента в единицах, в которых она была установлена в определении стиля. |
| posLeft | Смещение левого края. |
| posTop | Смещение верхнего края. |
| posWidth | Ширина элемента. |
Объект style позволяет изменить стиль любого элемента Web-страницы, просто присвоив нужному свойству необходимое значение.
paragraph1.style.fontSize = 7;
Можно изменить геометрические размеры элемента и его месторасположение:
image1.style.height = «100mm»;
image1.style.width = «120mm»;
iamge1.style.top = «200px»;
image1.style.left = «50px»;
Присваивание свойству строковых значений геометрических параметров с указанием единицы измерения не очень удобно, поэтому объект style предоставляет свойства pixel***, принимающие и возвращающие числовые значения в пикселах:
image1.style.pixelHeight = 400;
iamge1.style.pixelLeft +=5;
Можно использовать также свойства pos***, возвращающие и принимающие числовые значения в тех единицах измерения, в которых эти значения были заданы в определении стиля.
<IMG src=«image1.gif» id=«image1» style=«height: 100mm; width: 100»>
nheight = image1.style.posHeight; // Значение в миллиметрах
nwidth = image1.style.posWidth; // Значение в пикселах