Заранее прошу прощения для всех, кто не в теме.. Чтобы понять, что тут написано, нужно уже знать, что такое
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);
}
}
//----------------------------------------------------------