Jquery - изменить полный CSS (интерн)

Question

Я пытаюсь изменить полный код CSS (например, браузер стилей).

Первое решение

new_css = ' body {color:#00ff00; } #div { border: 1px solid red; }';

$("head > style:eq(1)").html(new_css);

Отлично работает в FF, Chrome и Safari... но не в IE.

Мое второе решение

var myStyle = document.styleSheets[1];

if( myStyle.cssRules )
{
    myStyle.insertRule('#dd { display:block; }', 0);            
} 
else
{
    if ( myStyle.rules )
    {
        myStyle.addRule('#dd'', 'display:block;');                  
    }
}

Как изменить полный CSS со вторым решением.Я нашел только единственные «методы» removeRule, deleteRule, addRule, insertRule.

PS: Или, возможно, можно использовать первое решение?

Answer 1

Я не проверял это во всех браузерах, но я полагаю, что вы могли бы поставить префикс всем вашим CSS одним классом для каждой таблицы стилей, а затем просто переключить класс тела?загрузить отдельные таблицы стилей (myTheme.css, myTheme2.css)

Первый стиль:

body.myTheme1{
  background-color:#321212;
}

body.myTheme1 div{
  background-color:#334231;
}

Второй стиль:

body.myTheme2{
  background-color:white;
}

body.myTheme2 div{
  background-color:#889911;
}

Answer 2

Вы также можете воспользоваться этим подходом:

$('body').css('color','#00ff00'); $('#div').css('border','1px solid red');

Это установит тело и #div так, как вы хотели.

Или еще лучшее решение - просто добавитьэти операторы в css, если только вы не хотите, чтобы они динамически менялись, а css там всегда будет лучшим решением.