如何创建更改网页字体的 Javascript/JSON 脚本答案

【问题标题】：How to create a Javascript/JSON script which changes the font of a webpage如何创建更改网页字体的 Javascript/JSON 脚本
【发布时间】：2019-05-20 12:50:05
【问题描述】：

我正在制作一个 chrome 扩展，它会更改字体以使网站看起来更漂亮。例如，它将 Comic Sans 更改为 Helvetica。

到目前为止，我的代码是这样的：

Index.html

<!DOCTYPE html>
<html>

Main.css

.some-font { font-family:"Comic Sans MS", "Chalkboard", cursive; }
.another-font { font-family: Helvetica, Sans-Serif; }

Main.js

$(document).ready(function() {
    $(‘h1’).removeClass(‘some-font’).addClass(‘another-font’);// all custom jQuery will go here
});

Mainifest.json

{
  "manifest_version": 2,
  "name": "Chrome Extension",
  "version": "1.0",
  "description": "Changes Fonts to make websites/mails look beter",
  "permissions": [
    "activeTab"
  ],
  "chrome_url_overrides": {
    "newtab": "index.html"
  },
  "incognito": "split",
  "icons": {
    "128": "icon.png"
    }

}

当我在邮件中尝试此操作时，它不起作用。有什么建议么？提前致谢！

【问题讨论】：

您需要在 manifest.json 中将 main.js 和 css 声明为内容脚本，以使其在网页上自动运行。你可以在你的css文件中简单地substitute local src for @font-family。
如何将 main.js 和 CSS 声明为内容脚本？另外，替换本地src是什么意思？
以overview 开头，它解释了什么是内容脚本以及如何声明它们。至于本地src，就在我给的链接里。

标签： javascript html css json google-chrome-extension

【解决方案1】：

（由 xOxxOm 求解）

将 main.js 和 css 声明为 manifest.json 中的内容脚本，使其自动在网页上运行。然后简单地将 css 文件中的 @font-family 替换为 local src。

【讨论】：