javascript - CSS 更改 [带 JS]

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");

我不是建议你引入整个库，只是使用他们的代码来获得如何使其跨浏览器的灵感。