如何在Greasemonkey脚本中用GM_addStyle隐藏动态类名元素？

针对动态类名div无法通过固定类名隐藏的问题，由于内部img的referrerpolicy="unsafe-url"属性固定，可通过以下两种方法实现持续隐藏：

方法1：CSS :has选择器（简洁高效） #

利用CSS属性选择器定位目标img，再通过:has选择器选中它的父div，添加强制隐藏样式：

GM_addStyle(`
div:has(img[referrerpolicy="unsafe-url"]) {
    visibility: hidden !important;
    /* 若需要完全移除占位，可替换为 display: none !important; */
}
`);

只要页面中出现带有指定属性的img，它的父div就会被自动隐藏，不受div类名变化影响。

方法2：JavaScript DOM监听（兼容性更强） #

如果担心部分环境不支持:has选择器，可通过MutationObserver监听DOM动态变化，实时查找并隐藏目标元素：

// 定义隐藏逻辑函数
function hideTargetDivs() {
    const targetImgs = document.querySelectorAll('img[referrerpolicy="unsafe-url"]');
    targetImgs.forEach(img => {
        const parentDiv = img.parentElement;
        if (parentDiv?.tagName === 'DIV') {
            parentDiv.style.visibility = 'hidden';
            // 可选：parentDiv.style.display = 'none';
        }
    });
}

// 页面加载完成后执行一次初始检查
window.addEventListener('load', hideTargetDivs);

// 监听DOM新增元素，实时处理
const observer = new MutationObserver(() => hideTargetDivs());
observer.observe(document.body, { childList: true, subtree: true });

该方法会在页面加载时检查一次，之后持续监听DOM变化，只要新增符合条件的元素就会立即处理，兼容性覆盖绝大多数现代浏览器。

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