用于修改HTML元素的Chrome内容脚本

Question

我想使用Google Chrome内容脚本修改以下HTML代码。

<font style="color:white;"> Text Here </font>

有人可以告诉我应该使用的代码来识别元素然后更改它，例如：

<font style="background-color:black;color:white;"> Text Here </font>

感谢您事先提出的​​意见。

Answer 1

您可以通过在扩展中包含JQuery库来实现此目的，然后您可以使用一行代码进行此更改。

$("font[style='color:white;']").css("background-color","black");

这将标识样式为color:white;的所有字体元素，并附加background-color:black;。

You can see it in action here

以下是如何在您的扩展程序中包含JQuery：

请记住在扩展根目录中包含jquery.js文件。

{
  ...
  "content_scripts": [
    {
      "matches": ["http://www.whateveryoulike.com/*"],
      "js": ["jquery.js", "myscript.js"]
    }
  ]
  ...
}