chrome插件开发1:永远的helloworld

最近在搞一个自己的项目,要用到chrome插件,所以得开始对chrome插件开发的学习,边学边写。原则不变,只为更简单。

首先,最好的学习地址: 官网,https://developer.chrome.com/extensions/getstarted.html。今天,就从这边开始。

不多说,开始第一个例子:helloworld


1、文件列表:

新建个文件夹,命名helloworld,包含以下文件:

manifest.json

html

js(可选)

其他需要的文件(可选)


下面是helloword的文件内容:

manifest.json

{
"manifest_version":2,

"name":"rydiy",
"version":"1.0",
"description":"My first chrome plugin",

"permissions": [
    "http://rydiy.net"
],
"browser_action":{
    "default_icon":"icon.png",
    "default_popup":"popup.html"
}
}


icon.png  19X19

js  简单的例子就不用了

popup.html

<html>
  <head>
    <title>Rydiy</title>
  </head>
  <body>
  helloworld
  </body>
</html>


2.加载

点击地址栏右边的菜单图标-》工具-》扩展程序-》点击开发者模式-》载入正在开发的扩展程序-》选择刚新建的helloworld文件夹。

加载后如图:


3.效果

现在看看地址栏右边多了个图标,点击图标,就能出现我们定义的helloworld。




只为更简单! --Rydiy


猜你喜欢

转载自blog.csdn.net/rydiy/article/details/8566061
今日推荐