http://jingyan.baidu.com/article/b907e627fb90fd46e7891c3c.html

Chrome 浏览器作为基于Webkit的新一代浏览器。Chrome自从正式发布以来,市场占有率逐步提高,自从公布了Chrome扩展的API以来,Chrome扩展开发更是前途似锦。一个Chrome插件小则可以解决生活中琐碎的问题,多则可以惠及千众,造福万代。而且,Google为Chrome建立了自己的Web开发市场,做得好的插件还可以为作者赢得丰厚的利益。

工具/原料

  • Chrome浏览器
  • 文本编辑工具,普通的记事本也可以,不过最好是带格式整理和语法高亮的,笔者用的是Notepad++,需要的朋友可以百度一下。

步骤/方法

  1. 1
    创建一个单独的文件夹,起个名字吧,比如说我们为百度贴吧开发一个插件,就叫TiebaAddion。之后在这个文件夹里创建一个名字为“manifest.json”的文件,在里面写上如下的样子。
    {
    "name": "TiebaAddin",
    "version": "1.0",
    "description": "An addin for Tieba.",
    "browser_action": {"default_icon": "icon.png"},
    "permissions": [http://*/*]
    }
    这里各项的意义很显然可以通过名字得之,但如果你想了解更多,请参考“Chrome扩展”文档(详见参考资料)
  2. 2
    如果你细心看上面的配置文件,你就会知道,你现在需要找一个图标,放在这个目录下,名字叫icon.png,当然,这个名字只要和上面的配置文件里default_icon的属性一致就好。
  3. 3
    现在,只要点击Chrome工具条的菜单按钮选择里面的工具(Tools)>> 扩展(Extensions)就好。菜单按钮如右图。
  4. 4
    选择开发者模式,选择加载未打包的插件,然后,选择第一步中的那个文件夹即可。好吧,现在我们就可以启动插件了。
  5. 5
    好了,在地址栏的右侧出现了我们的图标,但是点击图标却什么也没做,这是自然地,因为我们还什么代码没有写。现在在那个目录下,建立一个html文件,并且名字为popup.html,同时在配置文件里“browser_action”下加上一条:"popup": "popup.html"。示范:
    {
    "name": "TiebaAddin",
    "version": "1.0",
    "description": "An addin for Tieba.",
    "browser_action": {"default_icon": "icon.png","popup": "popup.html"},
    "permissions": [http://*/*]
    }
    此处注意,每一对大括号里的最后一项后面都没有逗号,其余的每项之间必须用逗号间隔!哪怕是browser_action这样复合的项目,在他的大括号后也要有逗号。
  6. 6
    在Popup.html里写上一些html代码,比如简单的输出HelloWorld也好,这个Popup.html和普通的html文件按没有任何差别。
  7. 7
    这就是基本的插件制作方法,插件制作的中级教程我在一下篇相关经验会详细讲解的

怎样开发Chrome浏览器的插件的更多相关文章

  1. chrome浏览器postman 插件安装

    postman 软件功能 模拟各种HTTPrequests 从常用的GET.POST到RESTful的PUT.DELETE…等等.甚至还可以发送文件.送出额外的header. Collection功能 ...

  2. chrome浏览器视频插件

    以前安装chrome浏览器flash插件是将libflashplayer.so拷贝到chrome浏览器的plugins目录下.但最近好像不行了. 于是换了另一插件:pepperflashplugin- ...

  3. 使用JavaScript开发IE浏览器本地插件实例

    使用JavaScript开发IE浏览器本地插件实例 投稿:junjie 字体:[增加 减小] 类型:转载 时间:2015-02-18我要评论 这篇文章主要介绍了使用JavaScript开发IE浏览器本 ...

  4. Chrome浏览器Postman插件安装使用

    最近调试后台接口一直在使用的工具,由于换了新的电脑重新安装了一下PostMan.随便记录一下如何安装使用这个插件. 闲言不要谈,直接上步骤: 1. 首先必须有chrome浏览器,这个相信大家肯定都安装 ...

  5. 自媒体人Chrome浏览器必备插件精选神器!

    自从互联网时代起,浏览器使用从最早的IE,到opera,到猎豹浏览器,到360双核浏览器,到火狐,到safari,到目前最喜欢用的chrome.一路下来,chrome的稳定性与扩展性征服了我,成了我必 ...

  6. CSS写一个圣诞树Chrome浏览器小插件

    一时兴起,突然想写一个Chrome浏览器插件,不知道写啥,就写了一个圣诞树小插件.项目源码>> Chrome浏览器插件 Chrome浏览器插件最主要的是:index.html.manife ...

  7. .net使用cefsharp开源库开发chrome浏览器(二)

    离上篇写介绍pc端的混合开发和为什么以cefsharp入手研究混合开发已经有好几天,一直忙,抽不出时间继续写怎么搭建cefsharp开发环境.其实没有时间是借口,一切都是懒,没有爱到深处. 今天继续写 ...

  8. Chrome浏览器安装插件提示(net::ERR_NAME_NOT_RESOLVED)

    在chrome的webstore中安装currently插件.使用goagentFQ后能正常访问,但出现"net::ERR_NAME_NOT_RESOLVED"错误. 该错误的含义 ...

  9. chrome浏览器美化插件:让你的浏览器页面冒水泡, 游小鱼儿

    下载插件和效果图 这是一个让你的浏览器冒泡泡的插件, 浏览网页的时候仿佛置身于海底世界: 插件下载地址:http://files.cnblogs.com/files/diligenceday/chro ...

随机推荐

  1. Poj 3982 序列

    1.Link: http://poj.org/problem?id=3982 2.Content: 序列 Time Limit: 1000MS   Memory Limit: 65536K Total ...

  2. Windows服务器nginx+tomcat服务负载均衡

    一.安装两个tomcat服务自启动 1. 解压两个tomcat,名称为分别1,2 2. 配置环境变量 3. 修改文件server.xml中的三个端口号,使得两个tomcat不冲突 (1)<Ser ...

  3. 第一个C++

    输入:cin>>(相当于scanf)   #include <iostream> using namespace std; int main() { int number;   ...

  4. jQuery学习教程(3)

    一.什么是DOM操作? 文档对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理可扩展标志语言的标准编程接口.在网页上,组织页面(或文档)的对象被组织在一个树形结 ...

  5. Json对象序列化与反序列化

    如果后台的参数数对象,需要在前台传入: JS代码: //创建JS对象 var CUTTING_TABLET_MO = new Object(); CUTTING_TABLET_MO.CUTTING_T ...

  6. php中类的声明与使用

    <?php /**php语言是支持面向对象编程的,对于面向对象的编程,学过java和C++的人都知道啊! *如果不清楚的去baidu问一下就可以了. */ //我们来定义一个类,定义类的关键字是 ...

  7. 让Ecshop网店系统用户自动登陆

    让Ecshop网店系统用户户自动登陆,打开ecshop includes/init.php文件,可以发现Ecshop系统判断用户的SESSION不存在的时候会去读取存储在COOKIES里面的值.如下代 ...

  8. mysql之创建外键报150错误的处理方法

    这几天由于在赶项目进度,也就没有及时记录下自己的学习情况 ,在完成项目的这段时间里,碰到了很多问题,在解决问题的过程中学习了不少技巧. 这里就主要介绍一下在mysql数据库中为表之间建立外键时报100 ...

  9. max_size, capacity and size 的区别

    The max_size() function returns the maximum number of elements that the container can hold. The max_ ...

  10. hdu 5343 MZL's Circle Zhou SAM

    MZL's Circle Zhou 题意:给定两个长度不超过a,b(1 <= |a|,|b| <= 90000),x为a的连续子串,b为y的连续子串(x和y均可以是空串):问x+y形成的不 ...