Question

我尝试使用以下用户脚本删除某个网站的所有音频：

// ==UserScript==
// @name        addicto
// @namespace   nms
// @include     http://*
// @include     https://*
// @version     1
// @grant       none
// ==/UserScript==

addEventListener('DOMContentLoaded', ()=>{
  let sites = ['mako.co.il'];
  let href = window.location.href;
  for (let i = 0; i < sites.length; i++) {
    if (href.includes(sites[i])) {
      Array.prototype.slice.call(document.querySelectorAll('audio')).forEach((audio)=>{
        audio.muted = true;
      });
    }
  }

  // If href includes the value of the iteration on the "sites" array, do stuff.
});

这段代码没有用，我认为随机观察所有audio标签并改变DOM正是我需要更好地应对这一点。

如何编写这种突变观察者？我从来没有写过一个变异观察者，我觉得这个例子非常简短，非常基本，正是我需要了解我刚刚描述的逻辑的代码上下文，我会非常感谢任何愿意的人试着向我和其他有类似问题的人展示它。

Answer 1

枚举addedNodes和每个变种@grant none
枚举节点的子元素，因为在页面加载期间使用超高速getElementsByTagName而不是superslow querySelectorAll来合并突变
不要使用在页面上下文中运行用户脚本的@run-at document-start，除非您确实需要直接访问该网页的JavaScript对象
在页面加载期间使用// ==UserScript== // @name addicto // @include * // @run-at document-start // ==/UserScript== const sites = ['mako.co.il']; if (sites.some(site => location.hostname.includes(site))) { new MutationObserver(mutations => { for (const m of mutations) { for (const node of m.addedNodes) { if (node.localName == 'audio') { audio.muted = true; } else if (node.children && node.children[0]) { for (const child of node.getElementsByTagName('audio')) { audio.muted = true; } } } } }).observe(document, {subtree: true, childList: true}); }静音音频

.splice

音频不会被JavaScript静音 - 删除需要使用mutationobserver的音频标签

1 个答案: