☰

相同的代码适用于 chrome DevTools 控制台，但不适用于 TamperMonkey

tag-icon • tag-icon google-chrome tampermonkey
相同的代码适用于 chrome DevTools 控制台，但不适用于 TamperMonkey

我正在尝试删除一个 div这一页使用 TamperMonkey。

此代码与 Chrome DevTools 控制台配合使用效果很好

var elems = document.getElementsByClassName('hdn hdb-m hfl-m');
elems[0].parentNode.removeChild(elems[0]);

但不适用于 TamperMonkey

// ==UserScript==
// @name         New Userscript
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @match        http://*/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';
    var elems = document.getElementsByClassName('hdn hdb-m hfl-m');
    elems[0].parentNode.removeChild(elems[0]);
})();

我错过了什么？

答案1

我不能确切地说，但我的有根据的猜测是，在您的脚本执行后，网站会通过 JavaScript 生成部分内容。默认情况下，tampermonkey 脚本在页面 HTML 加载和解析时执行。但大多数通过 JavaScript 生成页面的代码也是如此。因此，您可以看到在生成要删除的元素之前，脚本可能会如何运行。

最懒惰的解决方案是使用某个计时器来延迟执行，但在超时后删除元素时会出现难看的抽搐。示例：

function removeTheThing() {
    var elems = document.getElementsByClassName('hdn hdb-m hfl-m');
    elems[0].parentNode.removeChild(elems[0]);
}
setTimeout(removeTheThing, 1000);

更高级的方法是使用突变观察者，当页面发生变化时，可以立即触发代码。你可以试试，虽然工作量更大，但更优雅。

相关内容