如何開發一個瀏覽器插件？

編寫插件

一個插件的目錄如下：

根目錄下必須有manifest.json，其他的自己隨意。這個json就描述了這個插件的所有信息，應該調用的腳本等。

這個插件是在所有 mozilla.org 的頁面加上一個邊框。

json如下：

{
  "manifest_version": 2,  // 必須，json版本
  "name": "Borderify",  // 必須，插件名稱
  "version": "1.0", // 必須，插件版本
  "description": "Adds a red border to all webpages matching mozilla.org.",
  "icons": {
    "48": "icons/border-48.png" // 插件的展示圖標
  },
  "content_scripts": [
    {
      "matches": [
        "*://*.mozilla.org/*"  // 描述對哪些頁面適合該插件
      ],
      "js": [
        "borderify.js"  //調用的腳本
      ]
    }
  ]
}

 

引用的borderify.js如下（就一行）：

document.body.style.border = "5px solid red";

 

 

將插件加入到你的chrome瀏覽器中

如下：

或者輸入 chrome://extensions/ 進入插件管理

選擇 “加載已解壓的擴展程序” ：

選擇你創建的插件所在的目錄，即可。