利用tampermonkey向页面注入自定义Javascript

　　最近发现一款比较好用的插件，可以用来在页面中注入自定义的js，这样可以做一些自动化创建的东西，比如我要创建很多订单用来做测试，而手动点的话又太麻烦，所以可以用注入的js解决这个问题，页面加载完后使用js自动填充表单，然后提交。

　　可以在谷歌网上应用商店下载这个插件：【右上角三个点】–>【更多工具】–>【扩展程序(E)】–>【获取更多扩展程序】搜索tampermonkey就好了，如下：

安装后，右上就会有它的图标，如果有正在运行的脚本，他会有红色的下标：

点击【添加新脚本】就会跳出一个页面，并自动生成一些代码：

上图是我写的一个例子，贴一下代码：

// ==UserScript==
// @name         我的测试demo
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  just test!
// @author       You
// @match        http://so.csdn.net/so/
// @grant        none
// @requir       https://code.jquery.com/jquery-latest.js
// ==/UserScript==

(function() {
    'use strict';

    // Your code here...
    $("#queryform .search-text").eq(0).val("tampermonkey");
    $("#queryform .search-btn").eq(0).click();
})();

　　上述代码的功能是：在csdn搜索地址中运行两句代码，找到输入框，输入”tampermonkey”然后触发搜索按钮的点击事件。这样在打开搜索页面的时候，就自动执行上面的操作，然后就直接展示搜索结果啦。　
　　
　　@match 这一行是指定脚本生效的网址,如果有多个，再拷贝一行改掉网址就好了。可以使用通配符，比如http://so.csdn.net/* ，表示so.csdn.net站点下全生效。

键	示例	备注
@name	@name 脚本名称	脚本的名称。该项将显示在页面的标题以及链接内容，必填项
@description	@description 脚本功能描述	脚本功能的描述，显示在脚本标题下面，必填项
@namespace		@namespace 及 @name 这两个属性将帮助用户脚本管理器判断是否已安 装该脚本。
@version	@version 0.0.1	脚本的版本标记将使用 Mozilla 版本格式 并显示于脚本的简介页面，必填 项。
@include
@exclude
@match	@match ://so.csdn.net/	描述脚本将执行的页面。该列表会被分析并展示到脚本的简介页面，以及 用于脚本分类。
@require	@require http://cdn.bootcss.com/jquery.min.js	引用外部脚本到您的脚本
@updateURL @installURL @downloadURL		告知用户脚本管理器应该在哪个地址获取脚本更新。
@license		脚本所使用的许可协议名称或地址，该协议需包含用户是否允许二次分发 或修改 脚本的权利。不提供许可协议则表示用户仅允许个人使用且不得 二次分发；该协 议将在脚本的简介页面显示。
@supportURL		用户可获得该脚本技术支持的链接地址 (如：错误反馈系统、论坛、电子 邮件)，该链接将显示在脚本的反馈页面。
@contributionURL		用于捐赠脚本作者的链接，该链接将显示在脚本的反馈页面。
@contributionAmount		建议捐赠金额，请配合 @contributionURL 使用。
@compatible		标记此脚本与某个浏览器兼容，兼容性信息将显示在脚本的简介页面上。
@incompatible		标记此脚本与某个浏览器不兼容，兼容性信息将显示在脚本的简介页面 上。

贴一个Userscript Header官方文档地址：https://tampermonkey.net/documentation.php?ext=dhdg

　　以上只是写了个非常简单的例子，很明显，它能做的事非常多，如果掌握熟练，肯定是神器啊！
　　贴个资源链接：
　　最后补充一下，使用fiddler也可以注入js代码进行线上调试。具体操作自行搜索吧，网上有很多教程。