斗鱼直播油猴脚本:自动切换最高画质或最低画质


思路:

  1. 播放控件是动态加载,找到元素把父级全 console.log 确认加载顺序。
  2. 使用 MutationObserver 监听动态加载元素的父级,找到正确的子孙节点,然后点击画质选项。
    • 元素的 className 是框架动态生成,会变化,所以使用属性选择器 [value="画质 "] 找到元素。
    • 或者使用:
      • [class|="rate-"] (带有 rate- 前缀的元素)
      • [class^="rate-"] (以 rate- 开头的元素)
      • [class*="rate-"] (包含 rate- 的元素)
      • querySelector("#rateId ~ ul") 通过节点 id 定位通用兄弟节点 ul
  3. GM_setValue 储存画质选项。
  4. GM_registerMenuCommand 菜单栏切换画质。
  5. 问题:没有找到元素后,不能自动关闭监听,虽不会再触发。
    • 观察器在内部对节点使用弱引用。也就是说,如果一个节点被从 DOM 中移除了,并且该节点变得不可访问,那么它就可以被垃圾回收。
// ==UserScript==
// @name         斗鱼自动切换最高画质或最低画质
// @namespace    https://github.com/Eished
// @author       Eished
// @version      2021.08.03.5
// @description  斗鱼直播自动调整最低分辨率或最高分辨率;自动调整2K、蓝光、超清、高清清晰度;
// @license      AGPL-3.0
// @match        *://www.douyu.com/*
// @icon         https://www.google.com/s2/favicons?domain=greasyfork.org
// @grant        GM_setValue
// @grant        GM_getValue
// @grant        GM_registerMenuCommand
// ==/UserScript==

// console.log(document.querySelector(".layout-Player-videoMain"));
// console.log(document.querySelector(".layout-Player-videoSub"));

// // 以下为动态加载
// console.log(document.querySelector(".room-Player-Box"));
// console.log(document.querySelector(".room-Player"));
// console.log(document.querySelector("#room-html5-player"));

// // 以下为动态一次性加载
// console.log(document.querySelector(".container-cffcd4"));
// console.log(document.querySelector(".right-e7ea5d"));
// console.log(document.querySelector(".rate-5c068c > div > ul"));

(function () {
  'use strict';

  const videoSub = document.querySelector('.layout-Player-videoSub');
  if (videoSub == undefined) {
    return;
  }

  let Clarity = GM_getValue('Clarity');
  if (Clarity == undefined) {
    Clarity = 1;
    GM_setValue('Clarity', Clarity);
  }

  const observer = new MutationObserver(callback);
  observer.observe(videoSub, {
    childList: true,
    subtree: true,
  });

  function callback() {
    const controller = videoSub.querySelector(`[value="画质 "]`);
    if (controller) {
      observer.disconnect();
      let ul = controller.nextElementSibling;
      if (Clarity == 1) {
        ul = ul.firstElementChild; // 最高画质
      } else {
        ul = ul.lastElementChild; // 最低画质
      }
      ul.className ? console.log(ul.className) : ul.click();
    }
  }

  function high() {
    Clarity = 1;
    GM_setValue('Clarity', Clarity);
    location.reload();
  }

  function low() {
    Clarity = 0;
    GM_setValue('Clarity', Clarity);
    location.reload();
  }
  GM_registerMenuCommand('最高画质', high);
  GM_registerMenuCommand('最低画质', low);
})();

文章作者: iKnow
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 iKnow !
评论
 上一篇
使用百度AI接口ORC自动识别验证码 使用百度AI接口ORC自动识别验证码
使用百度 AI 接口 ORC 自动识别验证码百度 AI ORC 接口的使用https://cloud.baidu.com/doc/OCR/s/Ck3h7y2ia 请求格式POST 方式调用 注意:Content-Type 为applicat
2021-11-28
下一篇 
C/C++网络编程,从socket到epoll C/C++网络编程,从socket到epoll
虚拟机安装 ssh1.安装命令: sudo apt-get install openssh-server 安装完成,服务默认已经开启,可以远程ssh连接了。 2.查看ssh服务状态: sudo service ssh status 3.
2021-07-29