Справочник по JavaScript (Автор) - страница 11

Свойства и методы

Как и все остальные объекты, style поддерживает ряд свойств и методов. Их можно разделить на две группы:

и

Свойства первой группы в целом аналогичны соответствующим атрибутам стиля и имеют почти такие же имена за тем исключением, что символы "-" убираются, т.к. не соответстуют соглашению об именах JavaScript, а первые буквы всех слов, образующих имя атрибута, кроме первого, делаются прописными.В следующей таблице показаны примеры преобразования имен атрибутов стиля в имена свойств объекта style, устанавливающих стиль элемента.

По аналогии вы можете преобразовать все атрибуты стилей в свойства объекта style.Все не относящееся к стилю свойства объекта style перечислены в нижерасположенной таблице. Кроме того, у этого объекта имеются методы getAttribute, removeAttribute и setAttribute. Но эти дополнительные свойства и методы поддерживаются только IE начиная с 4.0

Работа с объектом style

Объект 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, возвращающие и принимающие числовые значения в тех единицах измерения, в которых эти значения были заданы в определении стиля.

nheight = image1.style.posHeight; // Значение в миллиметрахnwidth = image1.style.posWidth; // Значение в пикселах

Вы можете использовать методы getAttribute, setAttribute и removeAttribute для получения и установки значения и удаления какого-либо свойства стиля:

paragraph1.style.setAttribute("borderBottomWidth", 5, false);paragraph1.style.removeAttribute("borderTopWidth", false);

Объект style в Internet Explorer

Как же получить доступ к объекту style? Internet Explorer предоставляет для этого три свойства: style, currentStyle и runtimeStyle.

Первое свойство позволяет получить доступ к стилю, встроенному в тег элемента с помощью атрибута STYLE:

Любой текст

someColor = par1.style.color;