暴力油猴脚本教程

2024-07-13 01:55| 来源: 网络整理| 查看: 265

阅读以下内容所需知识：

javascript/jQuery基础知识【李炎恢的JavaScript教程（http://www.ycku.com/javascript/）（http://www.ycku.com/jquery/）】HTML基础知识【李炎恢的HTML5教程（http://www.ycku.com/html5/）】

一、油猴脚本插件的介绍与安装1、介绍简单的说就是往WEB页面嵌入本地脚本以改变页面的动作与风格2、安装1、chrome商店搜索 Violentmonkey（https://github.com/violentmonkey/violentmonkey/releases/download/v2.6.3/violentmonkey-2.6.3.crx）并安装2、本地安装，以QQ浏览器为例子：

首先下载 Violentmonkey（https://github.com/violentmonkey/violentmonkey/releases/download/v2.6.3/violentmonkey-2.6.3.crx）的crx文件然后进行如下操作（如图所示）：打开浏览器-->应用中心-->管理我的应用-->将下好的crx拖到浏览器-->确认安装

备注：问：可能会有人问为什么要使用 Violentmonkey（https://github.com/violentmonkey/violentmonkey/releases/download/v2.6.3/violentmonkey-2.6.3.crx）而不是使用 Tampermonkey（https://chrome.google.com/webstore/detail/tampermonkey/dhdgffkkebhmkfjojejmpbldmpobfkfo） ?答：因为 Violentmonkey（https://github.com/violentmonkey/violentmonkey/releases/download/v2.6.3/violentmonkey-2.6.3.crx）有搜索该网站脚本以及同步功能，更人性化、最主要是界面长得好看啊。如图所示：二、教程1、先来了解下脚本的元数据块元数据块是描述脚本的一个用户脚本部分。它通常包含脚本名称，命名空间，描述和包含和排除规则。元数据块出现在JavaScript行注释中，可能会出现在脚本内的任何位置，但通常靠近文件的顶部。

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

元数据块必须遵循以下格式：

// ==UserScript== // @key value // ==/UserScript==

备注：

Greasy Fork 要读取的脚本元键值【https://greasyfork.org/zh-CN/help/meta-keys】Metadata Block - GreaseSpot Wiki （api文档）【https://wiki.greasespot.net/Metadata_Block】

2、实践是检验真理的唯一标准以微博视频（http://weibo.com/tv/movie）的下载辅助为例子。在没有下载工具的情况下，以上的图片就是我们常用的下载方式。既然发现了包含mp4字样的链接地址，不妨继续到网页标签元素中在探索一番，说不定还会有其它的收获。真让人惊喜，video元素中竟然有视频直链。既然这样，我们只需要获取到video的src属性，再往页面上添加个下载按钮就能撇弃资源嗅探的繁琐下载方式了！！！思路已经想好了，那么就开始动手写代码吧。第一步，先把最基本的框架搭好。

第二步，编写下载弹出框与获取文件名的工具对象

第三步，生成一个下载按钮，并嵌入页面

//与元数据块中的@grant值相对应，功能是生成一个style样式 GM_addStyle('#down_video_btn{color:#fa7d3c;}'); //视频下载按钮的html代码 var down_btn_html = ''; down_btn_html += ''; down_btn_html += ''; down_btn_html += ''; down_btn_html += ''; down_btn_html += 'i'; down_btn_html += '视频下载'; down_btn_html += ''; down_btn_html += ''; down_btn_html += ''; down_btn_html += ' '; down_btn_html += ' '; //将以上拼接的html代码插入到网页里的ul标签中 var ul_tag = $("div.WB_handle>ul"); if (ul_tag) { ul_tag.removeClass("WB_row_r3").addClass("WB_row_r4").append(down_btn_html); }

图片说明：效果图：最后一步，获取播放器（video）对象中的视频地址并编写下载按钮的单击事件

$(function () { //获取播放器（video）对象 var video = $("video"); var video_url = null; if (video) { video_url = video.attr("src"); //获取视频链接地址 } //执行下载按钮的单击事件并调用下载函数 $("#down_video_btn").click(function () { if (video_url) { videoTool.download(video_url, videoTool.getFileName(video_url, "/", "?")); } }); });

完整代码及效果演示：

// ==UserScript== // @icon http://weibo.com/favicon.ico // @name 微博视频下载助手 // @namespace [url=mailto:[email protected]][email protected][/url] // @author test // @description 下载微博视频 // @match *://weibo.com/tv/v/* // @require http://cdn.bootcss.com/jquery/1.8.3/jquery.min.js // @version 0.0.1 // @grant GM_addStyle // ==/UserScript== (function () { 'use strict'; //与元数据块中的@grant值相对应，功能是生成一个style样式 GM_addStyle('#down_video_btn{color:#fa7d3c;}'); //视频下载按钮的html代码 var down_btn_html = ''; down_btn_html += ''; down_btn_html += ''; down_btn_html += ''; down_btn_html += ''; down_btn_html += 'i'; down_btn_html += '视频下载'; down_btn_html += ''; down_btn_html += ''; down_btn_html += ''; down_btn_html += ' '; down_btn_html += ' '; //将以上拼接的html代码插入到网页里的ul标签中 var ul_tag = $("div.WB_handle>ul"); if (ul_tag) { ul_tag.removeClass("WB_row_r3").addClass("WB_row_r4").append(down_btn_html); } var videoTool = { //获取文件名 getFileName: function (url, rule_start, rule_end) { var start = url.lastIndexOf(rule_start) + 1; var end = url.lastIndexOf(rule_end); return url.substring(start, end); }, //弹出下载框 download: function (videoUrl, name) { var content = "file content!"; var data = new Blob([content], { type: "text/plain;charset=UTF-8" }); var downloadUrl = window.URL.createObjectURL(data); var anchor = document.createElement("a"); anchor.href = videoUrl; anchor.download = name; anchor.click(); window.URL.revokeObjectURL(data); } }; $(function () { //获取播放器（video）对象 var video = $("video"); var video_url = null; if (video) { video_url = video.attr("src"); //获取视频链接地址 } //执行下载按钮的单击事件并调用下载函数 $("#down_video_btn").click(function () { if (video_url) { videoTool.download(video_url, videoTool.getFileName(video_url, "/", "?")); } }); }); })();

脚本发布，首先得有个 greasyfork 帐号。点击个人中心（即自己的昵称）-->提交脚本-->按要求填写脚本信息-->提交

例子:

// ==UserScript== // @name New script - taobao.com // @namespace Violentmonkey Scripts // @match https://item.taobao.com/item.htm // @grant none // @version 1.0 // @author - // @require https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js // @description 2021/6/17下午2:08:40 // ==/UserScript== $(function() { 'use strict' //创建菜单 setMenu() function start() { changeBF(document.querySelector("#rwl-start"), "#fff", "#67c23a") changeBF(document.querySelector("#rwl-close"), "rgb(96, 98, 102)", "#fff") console.log('start') } function close() { changeBF(document.querySelector("#rwl-close"), "#fff", "#f56c6c") changeBF(document.querySelector("#rwl-start"), "rgb(96, 98, 102)", "#fff") console.log('close') } function changeBF(e, f, b) { e.style.color = f e.style.backgroundColor = b } function setMenu(){ var oldEditBox = document.querySelector("#rwl-setMenu"); if(oldEditBox){ oldEditBox.parentNode.removeChild(oldEditBox); return; } // var userSetting = GM_getValue("rwl_userData"); var upload_checked = ""; var btnchecked = '' // style button let cssText = "border-radius: 50%;" + "padding: 12px;" + // "padding: 12px 20px;" + "display: inline-block;" + "line-height: 1;" + "cursor: pointer;" + "transition: .1s;" + "margin: 0;" + "outline: none;" + "box-sizing: border-box;" + "text-align: center;" + "color: #606266;" + "border: 1px solid #dcdfe6;" + "font-size: 14px;" var odom = document.createElement("div"); odom.id = "rwl-setMenu"; odom.style.cssText ="position: fixed;" + "top: 100px;" + "right: 20px;" + "z-index: 1000;";+ // "padding: 10px;" + // "background: #fff;" + "border-radius: 4px;"; var innerH = "" + "开 " + "关" + "" ""; odom.innerHTML = innerH; document.body.appendChild(odom); document.querySelector("#rwl-start").style.cssText = cssText + "background: #fff;" document.querySelector("#rwl-close").style.cssText = cssText + "background: #f56c6c;" + "color:#fff" document.querySelector("#rwl-start").addEventListener("click",start); document.querySelector("#rwl-close").addEventListener("click",close); } })

【本文地址】

暴力油猴脚本教程

暴力油猴脚本教程

今日新闻

推荐新闻