手把手教你开发chrome扩展VIP专享

手把手教你开发chrome 扩展一：开发Chrome Extenstion 其实很简单 Chrome 的更新速度可以说前无古人，现在我每天开机的第一件事就是打开Chrome 检查是不是有了新版本。界面清爽、操作人性化、网络备份资料和快速的启动速度令我爱不释手，还有它拥有众多的扩展程序，相对于 firefox的插件来说，数量上和质量上稍显不足，但相信 chrome 将会很快在扩展上超越 firefox，firefox上内存占用上实在不令人满意，也许我使用 firefox的一个原因就是因为firebug，不过相信 chrome 平台的类 firebug 插件也会很快出现。 Chrome 的扩展开发十分简单，我们只需要掌握 web 开发的htm+CSS+Javascript，就能很快开发出自己的扩展。 你需要了解的内容 在开发前首先要掌握一些基础知识。 1、Chrome 扩展文件 Chrome 扩展文件以.crx为后缀名，在Google Chrome 扩展官方网站下载扩展时，Chrome 会将.crx文件下载到 Chrome 的Application Data 文件夹的User Data\Temp下，一般是C:\Documents and Settings\User\Local Settings\Application Data\Google\Chrome\User Data\Temp，安装完成或者取消安装，该文件就会被删除。.crx实际上是一个压缩文件，使用解压文件打开这个文件就可以看到其中的文件目录，下图中是“关灯看视频”扩展的截图： 因此可以认为，我们实际上就是写一个 Web 应用，然后将按照 Chrome 的规定将一个快捷方式放在Chrome 工具栏上。 2、Browser Actions（扩展图标） 把Browser Actions 翻译成扩展图标不是很准确，但它的功能就是把你的应用显示在Chrome 工具栏上。我们在上面看到一个文件manifest.json，就是使用这个文件来把相应的图标和其他参数注册到 Browser Actions。比如下图中就是EverNote 的扩展图标。 3、Page Actions（地址栏图标） 如果你熟悉一些 Chrome 插件的话，你一定会发现有些扩展的图标不是显示在地址栏的右边，而是显示在地址内部右方，这就是 Page Actions 地址栏图标。 可以看出上面中有三个 Page Actions，图中我标出的是 Chrome 添加书签，现在你就会发现其实这个也是 Chrome 的扩展，只不是它是直接内置在 Chrome 的。 Page Actions 与 Brow ser Actions 的区别就是 Page Actions 不是随时都是显示的，必须在特定的页面中这个功能才能使用。因此在开发中注意：如果不是全部页面中都能使用的功能请使用 Page Actions 方式。 4、popu ...