如何隐藏或移除页面刷新时动态生成的带随机类名的div？

这个问题我碰到过不少，核心是抓住动态元素的固定标识——你提到的div虽然类名每次刷新都变，但它带有固定的data-app-name=""属性，这就是我们可以利用的关键！下面给你两个实用的解决方案：

方案一：用CSS快速隐藏（最简单） #

直接通过属性选择器定位这个元素，强制隐藏它，不需要写任何JS代码：

/* 匹配所有data-app-name属性为空的div，直接隐藏 */
div[data-app-name=""] {
    display: none !important;
    /* 如果担心display被覆盖，也可以用：visibility: hidden !important; 或者 position: absolute !important; left: -9999px; */
}

原理：CSS的属性选择器不依赖类名，只要元素的data-app-name属性值为空，就能精准匹配到它，不管类名怎么变都生效。

方案二：用JavaScript彻底移除（更彻底） #

如果需要彻底把这个元素从DOM中删掉（而不是仅仅隐藏），可以用MutationObserver来监听页面的动态元素生成——毕竟这个div是页面加载后才动态添加的，普通的DOMContentLoaded可能抓不到它：

// 监听body下的元素变化
const observer = new MutationObserver((mutations) => {
    mutations.forEach((mutation) => {
        // 遍历新增的节点
        mutation.addedNodes.forEach((node) => {
            // 判断是否是我们要找的div
            if (node.nodeType === 1 && node.tagName === 'DIV' && node.getAttribute('data-app-name') === '') {
                node.remove(); // 彻底移除元素
                observer.disconnect(); // 找到后可以停止监听，节省性能
            }
        });
    });
});

// 开始监听body的子元素变化（如果元素嵌套在其他容器里，记得开启subtree选项）
observer.observe(document.body, {
    childList: true,
    subtree: true
});

这个方法的优势是：不管这个div什么时候被动态插入到DOM里（哪怕是页面加载后很久），都能精准捕获并移除，不会漏掉。

额外提示 #

如果页面上有多个data-app-name=""的div，你可以再结合其他特征（比如它的父元素类名、位置等）来缩小范围，避免误删其他元素。测试的时候可以打开浏览器控制台，手动触发刷新，看看元素是否被正确处理。

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