阻止每个网站域解析所有或某些DOM内容

Sha*_*ade 7 javascript parsing dom dom-events ecmascript-2018

我创建了一个小的命令式原始JavaScript脚本,以阻止分散注意力的新闻网站,让我感到上瘾的行为包括:

// ==UserScript==
// @name         blocksite
// @match        *://*.news_site_1.com/*
// @match        *://*.news_site_2.com/*
// ==/UserScript==

function blocksite () {
    document.body.innerHTML =`<div dir="ltr"; style="font-size:100px; font-weight: bold; text-align: center">Blocked !</div>`;
}

setTimeout( blocksite(), 1000)
setTimeout( blocksite(), 5000) // Block possible later DOM mutations;
setTimeout( blocksite(), 10000) // Block possible later DOM mutations;
Run Code Online (Sandbox Code Playgroud)

该脚本基本上可以正常工作(一个弹出窗口会接管DOM),但是我的问题是,仅在解析和呈现了所有DOM内容之后,它才阻止站点,而我通常希望阻止解析。

尽管监听load事件为时已晚,但是监听早期DOMContentLoaded事件可能比监听load或收听更好的结果setTimeout(),因为阻塞可能是在解析内容而不是呈现之后立即发生的。
但是,我需要一种完全阻止对相关网站的任何网页进行解析的方法(或者,在解析第一个DOM HTML元素节点之后,阻止任何进一步的解析)。

我尝试过的

根据评论,我在Google Chrome浏览器中尝试过:

window.stop();我不记得有任何重大更改
window.close();它仅在devtool控制台上
window.location.replace("about:blank");对我有用它仅在load事件完成后而不是在解析开始时对我有用

我的问题

使用最新的ECMAScript(10)甚至不需要执行该操作,如果需要,应该使用什么命令?


Sxribe更新:

亲爱的Sxribe,我用以下代码创建了以下文件。
该文件确实由Tampermonkey加载(带有正确的@match列表),但是加载匹配的网站时,我没有看到浏览器的任何更改(这些网站未被阻止并正常加载)。

文件中的代码

<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>This is a Heading</h1>
<p>This is a paragraph.</p>

</body>
</html>
Run Code Online (Sandbox Code Playgroud)

Tampermonkey中的文件呼叫

window.open("C:\Users\MY_USER_NAME\Desktop\blocksite.html");
Run Code Online (Sandbox Code Playgroud)

FZs*_*FZs 5

要中止网站的加载,您可以简单地使用window.stop()方法。

当被调用时,当当前脚本运行完毕时,网站的解析将完全停止。

例如:

<p>Before scripts</p>
<script>
  document.write('<p>Before stop</p>')
  console.log('Before stop')

  window.stop()

  document.write('<p>After stop</p>')
  console.log('After stop')
</script>
<p>Between scripts</p>
<script>
  console.log('Second script')
  document.write('<p>Second script</p>')
</script>
<p>After scripts</p>
Run Code Online (Sandbox Code Playgroud)

上面的HTML显示:

Before scripts
Before stop
Run Code Online (Sandbox Code Playgroud)

同时您可以在控制台中看到以下内容:

Before stop
After stop
Run Code Online (Sandbox Code Playgroud)

这表明<script>调用.stop()已得到完全评估,但之后.stop()未显示对DOM所做的更改。

另外,要擦除全部DOM内容,最好重定向浏览器,该解决方案即使在页面加载后也可以使用:

window.open('about:blank','_self')
Run Code Online (Sandbox Code Playgroud)


Sxr*_*ibe 1

旧的错误答案: https: //hastebin.com/vujuduforu.txt

好吧,chrome/firefox 不喜欢用 window.close() 打开本地文件。最后,我只是简单地将网站托管在 glitch.com 上(100% 免费),然后重定向到它。这是我的所有代码:

篡改猴脚本:

// ==UserScript==
// @name         blocktest
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @match        *://*.bing.com/*
// ==/UserScript==

(function() {
    'use strict';
    window.open("https://block-sxribe.glitch.me/", "_self");
})();
Run Code Online (Sandbox Code Playgroud)

HTML:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>This site has been blocked.</title>
    <link rel="stylesheet" href="./index.css">
</head>
<body>
    <div class="flex-container">
        <div class="content">
            <h1>This site has been blocked.</h1>
            <p id="sep"></p>
            <p>This site was blocked with Tampermonkey.</p>
        </div>
    </div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

CSS:

@import url('https://fonts.googleapis.com/css?family=Open+Sans&display=swap');

* {
    margin: 0;
    padding: 0;
    font-family: 'Open Sans', sans-serif;
    text-transform: uppercase;
}

.flex-container {
    width: 100vw;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}

#sep {
    margin-left: 20vw;
    width: 60vw;
    border-bottom: 1px solid lightgray;
}
Run Code Online (Sandbox Code Playgroud)

tl;dr 在线托管网站,运行 window.open("website location.com", "_self") 在当前窗口打开网站。