Question

我正在使用StyleBot [Chrome插件]并对网页进行了以下更改：

td.forumRow {
font-style: normal;
font-family: Verdana;
font-variant: normal;
font-size: 8pt;
text-decoration: none;
}

td.forumRowHighlight {
font-size: 8pt;
font-family: Verdana;
}

span.normalTextSmaller {
font-family: Verdana;
font-size: 8pt;
}

tbody tr td {
font-family: Verdana;
font-size: 8pt;
}

a.linkMenuSink {
font-size: 8pt;
font-family: Verdana;
}

不是使用StyleBot，是否可以使用javascript脚本进行相同的更改？

Answer 1

是。这里...

var css = document.createElement("style");
css.type = "text/css";
css.innerHTML = "PASTE YORU CSS HERE"
top.document.body.appendChild(css);

记住，在这里写着“在这里粘贴你的CSS”，你必须删除所有的换行符。使用此工具执行此操作：http://www.minifycss.com

Answer 2

您可以使用jQuery轻松完成：

在你的情况下：

$("<style type='text/css'> td.forumRow { font-style: normal; font-family: Verdana; font-variant: normal; font-size: 8pt; text-decoration: none;}</style>").appendTo("head");

Answer 3

Ext-JS使用http://docs.sencha.com/ext-js/4-1/#!/api/Ext.util.CSS

来完成它

源代码：http://docs.sencha.com/ext-js/4-1/source/CSS.html#Ext-util-CSS

Ext.util.CSS.updateRule("td.forumRow", "font-style", "normal");

我并不是建议您引入整个库，只需使用他们的代码获取有关如何跨浏览器的灵感。

CSS改变[使用JS]

3 个答案: