如何用jQuery或JavaScript阻止元素显示？Tampermonkey脚本失效求助

嘿，我来帮你搞定这个YouTube元素隐藏的问题！从你给出的代码片段来看，大概率是元素加载时机不对或者选择器不准确导致的——毕竟YouTube是动态渲染的单页应用，DOM结构还经常更新。下面给你几个具体的解决方案：

一、核心问题分析 #

1. 动态加载问题：你的脚本在页面初始加载时就执行了，但YouTube的很多元素（比如侧边栏的Creator Studio入口）是后续动态生成的，这时候脚本找不到目标元素，自然没法隐藏。
2. 选择器失效：YouTube的DOM结构经常调整，原来的#label:contains('Creator Studio')可能已经对应不上现在的元素了。

二、修正后的完整脚本 #

我给你写了一个能正常工作的版本，结合了动态DOM监听和更通用的选择器：

// ==UserScript==
// @name Minimal YouTube
// @namespace http://tampermonkey.net/
// @version 0.1
// @description Make some changes to YouTube
// @author You
// @match https://www.youtube.com/*
// @grant none
// @require http://code.jquery.com/jquery-3.3.1.min.js
// ==/UserScript==

(function() {
    'use strict';

    // 封装隐藏逻辑，方便重复调用
    function hideCreatorStudioEntry() {
        // 注意：这里的选择器可能需要根据当前YouTube的DOM调整
        // 找到包含"Creator Studio"文本的链接，然后隐藏它所在的整个侧边栏条目
        const targetEntry = $("a:contains('Creator Studio')").closest("ytd-guide-entry-renderer");
        
        if (targetEntry.length) {
            targetEntry.hide();
            console.log("已成功隐藏Creator Studio条目");
        }
    }

    // 页面初始加载后先执行一次
    hideCreatorStudioEntry();

    // 监听DOM变化，处理动态生成的元素
    const domObserver = new MutationObserver((mutations) => {
        mutations.forEach(mutation => {
            // 当有新节点添加到DOM时，重新检查并隐藏元素
            if (mutation.addedNodes.length > 0) {
                hideCreatorStudioEntry();
            }
        });
    });

    // 开始监听整个body的子节点变化（包括子树）
    domObserver.observe(document.body, {
        childList: true,
        subtree: true
    });

})();

三、关键调整说明 #

1. MutationObserver监听：这是比定时轮询更高效的方式，能实时捕捉到YouTube动态添加的DOM元素，确保目标元素一出现就被隐藏。
2. 选择器优化：现在通过找到包含文本的链接，再定位到它的父容器（ytd-guide-entry-renderer），这样能隐藏整个侧边栏条目，而不是只隐藏标签本身。如果这个选择器还是不对，你可以自己用浏览器开发者工具（F12）找到目标元素，右键→复制→复制选择器，替换掉代码里的选择器即可。
3. 封装重复逻辑：把隐藏操作封装成函数，方便初始执行和DOM变化时重复调用。

四、备选方案（定时轮询） #

如果MutationObserver用着不习惯，也可以用简单的定时轮询代替，代码更直观：

// ==UserScript==
// @name Minimal YouTube
// @namespace http://tampermonkey.net/
// @version 0.1
// @description Make some changes to YouTube
// @author You
// @match https://www.youtube.com/*
// @grant none
// @require http://code.jquery.com/jquery-3.3.1.min.js
// ==/UserScript==

(function() {
    'use strict';

    setInterval(() => {
        const targetEntry = $("a:contains('Creator Studio')").closest("ytd-guide-entry-renderer");
        if (targetEntry.length) {
            targetEntry.hide();
        }
    }, 500); // 每500毫秒检查一次

})();

这个方案虽然效率略低，但胜在简单易懂，适合快速调试。

内容的提问来源于stack exchange，提问作者NoobCoder