开发第一个自己的Chrome插件

这些天一直在想，作为一个名义上的程序员，对于网页编程却一窍不通，不但有愧于标签，也是错过了一些眼前的机会，比如自动填表、自动提交等等。临渊羡鱼，不如百度开始学习吧。

本来想先实现一个前年喧嚷一时的阿里抢月饼页面，发现需要借助于Chrome扩展程序，于是开发出了属于自己的第一个Chrome插件。

先写下列一段文本，保存为manifest.json（编码选择utf-8），作为插件的入口：

{

"name": "第一个Chrome插件",

"manifest_version": 2,

"version": "1.0",

"description": "我的第一个Chrome插件",

"browser_action": {

    "default_icon": "1.png"

  },

"content_scripts":

  [ 

    { 

"matches": ["https://www.baidu.com/*"],     

"js": ["myscript.js"] 

    } 

  ]

}

其中1.png为程序显示的图标，随便选择一个图片文件改名为1.png即可。"js"为这个插件在满足匹配（match）条件（网页地址为百度）时发生的动作，内容如下：

alert("HelloWorld");  

document.body.style.backgroundColor="gray";  

它的作用是弹出一个对话框，并将网页背景颜色变灰。保存为myscript.js文本文件（编码选择utf-8）。

准备好这两个文件后，打开Chrome，在打开菜单，找到扩展程序选项我的在更多工具-->扩展程序，点击进入扩展程序管理界面，加载扩展程序，选择存放这两个文件的文件夹，就可发现我写的扩展程序已被添加到浏览器中了。

红圈中的图标为我开发的扩展程序

打开百度首页，浏览器就会给弹出"HelloWorld"提示框，点击确定后，网页背景颜色变为灰色。

页面变灰效果

这里展示了Chrome扩展程序的威力，它可以获取到所匹配页面的元素，并对其进行操作。至于抢月饼的实现，大致是扩展程序根据预定时间或者周期刷新检查按钮状态，满足条件后，触发按钮点击动作，完成抢购。继续学习，明天把它实现。