关于最近阿里内部员工抢月饼事件引发的js程序扩展

前段时间关于阿里内部员工抢月饼事件传遍了整个程序界，今天，就浅谈下如何编写js扩展程序来达到你需要的东西

干货开始啦！！！

首先，今天我们用到的是chrome浏览器，当然也有其他的浏览器如火狐浏览器（自己可以百度，查找资料），个人认为谷歌浏览器插件扩展还是蛮不错的（个人推荐！）；

步骤：

1，建立一个文件夹，命名为 ChromeExtend

2，在ChromeExtend这个文件夹中，建立一个manifest.json文件，作为这个程序的扩展配置文件，把需要填写的信息都可以放到这个json文件里，大概内容如下：

{
  "name":"我的Chrome插件之弹窗helloworld！",
  "manifest_version":2,
  "version":"1.0",
  "description":"我的第一Chrome插件，持续更新中！",
  "browser_action":{
    "default_icon":"1.png"
  }
}

注释：“1.png”，可以随便抽出一个图片发到ChromeExtend这个文件中，它的作用就是来提示你安装的插件扩展程序，如我的安装成功后，会在你浏览器右上角扩展程序栏中

显示如下（下面有安装步骤）：

另外需要注意的是，json文件的字符子集为utf-8，统一管理；

其实到这，你已经完成了一大半了！！！

接下来，我们就开始用到谷歌浏览器，来安装你写到扩展程序了，打开谷歌扩展程序，选择如下图的“加载已解压的扩展程序”（我的是mac，windows系统也是勾选此选项，肯能文字描述不太一样吧）

然后便是你选中你刚才建立的那个ChromeExtend文件夹，选择“打开”便成功了！（看看你浏览器扩展程序栏中的右上角，有没有你刚才的“1.png”图片！！！）

3，接下来，我们便开始写我们的js（干货啊）

我们把helloword的代码添加上去，在manifest.json文件上添加以下代码：

"content_scripts":[
    {
      "matches":["https://www.zhihu.com/*"],
      "js":["my.js"]
    }
  ]

注释：matches  里配置的是你的 要放入js的域名  ；  js    便是你要执行的js代码；

以下就是my.js一句简单的代码：

alert('Hello World!');

这里我们看到了“content_scripts”，其实它的作用就是要让你的js在你需要的页面中之行，具体详细的配置信息，自己可以百度哦，这里就不多介绍啦！

4，写完后，在你扩展程序中，点击“重新加载”，如下图：

5，完美收官！

完成代码：

{
  "name":"我的Chrome插件之弹窗helloworld！",
  "manifest_version":2,
  "version":"1.0",
  "description":"我的第一Chrome插件，持续更新中！",
  "browser_action":{
    "default_icon":"1.png"
  },
  "content_scripts":[
    {
      "matches":["https://www.zhihu.com/*"],
      "js":["my.js"]
    }
  ]
}