带有css选择器的addRule / insertRule

Question

是否可以使用addRule或insertRule来传递id选择器？ 即：

document.styleSheets[1].addRule('div #3', 'font: 14px verdana');

会为div创建规则吗？

或者有任何已知的工作吗？

Answer 1

您的代码无效，因为选择器无效。 ID选择器#3无效，因为ID选择器cannot begin with a digit。

要解决此问题，请使用通过有效选择器选择 的ID，例如#three：

document.styleSheets[1].addRule('div #three', 'font: 14px verdana');

Answer 2

或者，您可以尝试以下方法：http://pp19dd.com/2012/01/add-inline-css-or-remote-css-file-with-javascript/

function css_add_file( css_url ) {
    var c = document.createElement('link');
    c.type = 'text/css';
    c.rel = 'stylesheet';
    c.href = css_url;
    c.media = 'screen';
    c.title = 'dynamicLoadedSheet';
    document.getElementsByTagName("head")[0].appendChild(c);
}

它允许您或多或少地注入CSS规则而无需对其结构进行微观管理。

例如：css_add_inline( "div#three { font-size:14px; font-family: Verdana; }" );