Про динамический HTML -)

Oct 12, 2008 09:28


Заранее прошу прощения для всех, кто не в теме.. Чтобы понять, что тут написано, нужно уже знать, что такое HTML, JavaScript и CSS.

Я очень давно не могу понять, почему в спецификации JavaScript для обращения к элементу документа имеется функция document.getElementById(), и вместе с тем, нигде нет даже и намека на что-нибудь аналогичное для изменение свойств класса!

Первая функция - незаменима, если мы хотим динамически поменять скриптом стиль отображения элемента на странице. Для этого достаточно просто написать: document.getElementById("Id").style = "new style";

В общем, я решил немного исправить эту ситуацию и привожу тут функцию, которая позволяет с помощью JavaScript изменять стиль отображения любого допустимого селектора (предполагается, что в таблице стилей он находится в самом конце, а также, что таблица в документе всего одна), в том числе и класса, не подменяя целиком весь стиль, а только отдельное правило.

//---------------------------------------------------------- // Функция, позволяющая задать стиль определенному селектору function setStyle(selector, style) { // CSS2 спецификация if (document.styleSheets[0].cssRules) { // удаляем последнее правило (на случай, если дописывали новое в конец) document.styleSheets[0].deleteRule(document.styleSheets[0].cssRules.length - 1) // добавляем в конец правило document.styleSheets[0].insertRule(selector + "{"+ style + ";}", document.styleSheets[0].cssRules.length); } // Internet Explorer if (document.styleSheets[0].rules) { // удаляем последнее правило (на случай, если дописывали новое в конец) document.styleSheets[0].removeRule(document.styleSheets[0].rules.length - 1); // добавляем в конец правило document.styleSheets[0].addRule(selector, style); } } //----------------------------------------------------------

инструкция

Previous post Next post
Up