chrome浏览器插件开发入门例子

官方api文档 https://developer.chrome.com/extensions/devguide

入门例子 https://developer.chrome.com/extensions/getstarted

chrome插件的启动设置是以一个json (https://www.json.org/json-zh.html) 格式的文件指定的 ，manifest.json, 例子里声明了以下这些name/value pair

a browser action，

the activeTab permission to see the URL of the current tab ，

the storage permission to remember the user's choice of background color for a page.

以上定义browser action时候，我们加了两个name/value pair,: icon.png 和 popup.html， 这两个文件必须也在项目目录下

icon.png是那个会出现在地址栏右侧的插件图标，它是个19px-square PNG file

popup.html是当您点击插件图标时候会弹出来的窗口页面，它的页面内容实际上是如何显示的？这背后的逻辑是由popup.js 实现的，虽然manifest.json里没有指定这个文件。

到这里，您的目录下已经有四个文件， icon.png,manifest.json,popup.html,popup.js.

现在来试试看把这些文件载入chrome

you can drag and drop the directory where your extension files live onto chrome://extensions in your browser to load it.

拨弄您的代码：

让我们来为图标加一个提示信息，

"browser_action":

{...

"default_title":"Click here!"

}

manifest文件只在插件被加载时候才被解析，如果你想看到改变代码以后的变化，就需要重载 extension: Visit the extensions page (go to chrome://extensions), and click Reload under your extension.  当您在chrome://extensions/这个页面按下Ctrl+R时候，所有的插件也都会被重载