3.编写油猴脚本之-helloword
Start
通过上一篇文章的学习,我们安装完毕了油猴插件。今天我们来编写一个helloword的脚步,体验一下油猴。
1. 开始
点击油猴插件=>添加新脚本
默认生成的脚本
// ==UserScript==
// @name New Userscript
// @namespace http://tampermonkey.net/
// @version 0.1
// @description try to take over the world!
// @author You
// @match http://*/*
// @icon data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
// @grant none
// ==/UserScript==
(function() {
'use strict';
// Your code here...
})();
解释:
-
不会编写脚本?没关系,可以点击获取脚本,然后根据你的需求,去下载并使用对应脚本。
-
当然我这个系列的目标是,自己编写脚本,根据我们自己具体的需求,去自定义脚本。
-
上述生成的基础脚本代码,可以发现其实也是一个JS文件。
-
开头有很多行注释的内容,这些注释的内容有用吗?有什么用?
下一节内容会对这里作说明
-
后续的具体代码,可以看到,其实就是编写JS代码。
2. 注释项说明
在基础的脚本示例中,开头有很多注释行,既然是注释,那么他们有用吗?
我删除掉注释行,保存试一下?
结合上述的截图,我们可以发现,当我删除掉这些注释行,点击保存按钮时,系统会提示我们“脚本无效”。
那么这些注释代表什么意思呢?
2.1 注释项详细说明
官方注释项说明文档
常见的项:
标题 | 作用 | 使用实例 |
---|---|---|
name | 脚本的名称。 | New Userscript |
version | 脚本的版本 | |
description | 脚本的说明 | |
author | 脚本的作者 | |
match | 匹配脚本运行网页的url | |
grant | 引入函数,或者变量 | |
@include | 脚本应运行的页面。允许多个标记实例。 | |
@require | 指向在脚本本身开始运行之前加载和执行的 JavaScript 文件。 |
3. 编写一个 helloworld 脚本。
// ==UserScript==
// @name tomato_shell
// @version 0.1
// @description 脚本的说明 hellotomato
// @author tomato
// @match http://*/*
// @match https://*/*
// @icon data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==
// @grant none
// ==/UserScript==
/*
1.虽然是注释,但是通过`==UserScript==`包裹。用来和普通的注释做区分
==UserScript==
==/UserScript==
*/
/*
2.@match
定义所有的http或者https的网站,都会加载我们的脚本。
*/
(function() {
'use strict';
// 3.编写一个输出
console.log('我是番茄')
// 4.打印一下全局变量
console.log(globalThis,'')
// 查看是否可以deb
debugger
})();
文章来源:https://www.toymoban.com/news/detail-464792.html
解释文章来源地址https://www.toymoban.com/news/detail-464792.html
- 设定match 可以执行脚本的网站,就可以执行我们的js代码
- 答应全局变量是window
- 可以通过 debugger 调试我们的脚本
到了这里,关于3.编写油猴脚本之-helloword的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!