Можно ли изменить таблицу стилей CSS с помощью JavaScript? (НЕ стиль объекта, но сама таблица стилей)

Можно ли изменить таблицу стилей CSS с помощью JavaScript?

Я НЕ говорю о:

document.getElementById('id').style._____='.....'; 

Я говорю об изменении:

 #id { param: value; } 

кроме того, что-то грязное (чего мы еще не пробовали btw), например, создание нового объекта в голове, innerHTML – тег стиля и т. д. Хотя это, даже если бы оно действительно работало, создавало бы несколько проблем как стиль блок уже определен в другом месте, и я не уверен, когда / если браузер даже проанализирует динамически созданный блок стиля?

По состоянию на 2011 год

Да, вы можете, но у вас будут проблемы с совместимостью между браузерами:

http://www.quirksmode.org/dom/changess.html

По состоянию на 2016 год

Поддержка браузера значительно улучшилась (поддерживается каждый браузер, включая IE9 +).

  • Метод insertRule() позволяет динамически добавлять правила в таблицу стилей.

  • С помощью deleteRule() вы можете удалить существующие правила из таблицы стилей.

  • Правила в таблице стилей можно получить через атрибуты cssRules таблицы стилей.

Мы можем использовать комбинацию .insertRule и .cssRules чтобы иметь возможность сделать это вплоть до IE9:

 function changeStylesheetRule(stylesheet, selector, property, value) { // Make the strings lowercase selector = selector.toLowerCase(); property = property.toLowerCase(); value = value.toLowerCase(); // Change it if it exists for(var i = 0; i < s.cssRules.length; i++) { var rule = s.cssRules[i]; if(rule.selectorText === selector) { rule.style[property] = value; return; } } // Add it if it does not stylesheet.insertRule(selector + " { " + property + ": " + value + "; }", 0); } // Used like so: changeStylesheetRule(s, "body", "color", "rebeccapurple"); 

демонстрация

Когда я хочу программно добавить кучу стилей в объект, мне легче программно добавить class к объекту (у такого classа есть стили, связанные с ним в вашем CSS). Вы можете управлять порядком приоритета в своем CSS, чтобы новые стили нового classа могли переопределить те вещи, которые у вас были ранее. Это, как правило, намного проще, чем изменение таблицы стилей напрямую и отлично работает в кросс-браузере.