Chrome 浏览器扩展开发

建立 manifest.json 配置文件

  1. {  
  2.   "name": "WordBull",  
  3.   "version": "0.1.0",  
  4.   "description": "Extract Words From Text and Translate",  
  5.   "browser_action": {  
  6.     "default_icon": "icon.png",                        // 图标
  7.     "default_title": "WordBull",                       // 标题
  8.     "default_popup": "popup.html"                      // 点击右上角图标弹出的页面
  9.   },
  10.   "background": {
  11.     "scripts": ["background.js"]                         
  12.   },
  13.   "permissions": [
  14.     "contextMenus",                                      // 开启右键菜单
  15.     "tabs"
  16.   ],
  17.   "manifest_version": 2
  18. }

建立 popup.html

  1. <h1>Hello World</h1>

建立 background.js

  1. chrome.contextMenus.create({
  2.     title: '提取单词',                  // %s表示选中的文字
  3.     contexts: ['selection'],            // 只有当选中文字时才会出现此右键菜单
  4.     onclick: function(params)
  5.     {
  6.         chrome.tabs.create({url: 'http://47.106.118.26:8000/?txt=' + encodeURI(params.selectionText)});
  7.     }
  8. });

在 Chrome 中加载

更多工具 -> 扩展程序 -> 加载已解压的扩展程序 -> 选择上述文件所在的文件夹即可
加载成功后，可在右上角点击图标可见 Hello World 弹出的页面，在普通页面选中文字点击右键可见提取单词
更多功能可见谷歌浏览器扩展开发文档