Question

upd。好，我自己解决了。

我使用waitForKeyElements的Brock Adams函数在https://www.google.com/页面上的链接后创建复选框。

单击复选框时，相应的复选框会将其状态更改为“已访问”。（它有效，不需要修复。）

问题是，由于某种原因，不是在每个链接之后放置单个复选框，而是在每个链接后面紧跟着很多复选框。

如何解决？

// ==UserScript==
// @grant   none
// @match   https://*.google.*/
// @name    Google.com
// @require https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js
// @require https://gist.githubusercontent.com/BrockA/2625891/raw/9c97aa67ff9c5d56be34a55ad6c18a314e5eb548/waitForKeyElements.js
// ==/UserScript==

(function() {
    'use strict';

    // Part 1. To distinguish between visited and unvisited links

    function addGlobalStyle(css) {
        var head, style;
        head = document.getElementsByTagName('head')[0];
        if (!head) return;
        style = document.createElement('style');
        style.type = 'text/css';
        style.innerHTML = css
            .replace(/;/g, ' !important;')
            .replace(/\/\/.*[\s]*/g, '');
        head.appendChild(style);
    }

    addGlobalStyle(`
        a:link    {color: #008ace;}
        a:visited {color: #b40eb4;}
    `);

    // Part 2. Adding checkboxes.
    // When you click the checkbox, the corresponding link will became
    // "visited".

    function test() {
        var links = document.querySelectorAll('a');
        var i;
        for (i = 0; i < links.length; i++) {
            var input = document.createElement('input');
            input.type = 'checkbox';
            input.dataset.url = links[i].href;

            input.addEventListener('change', function() {
                let desired_url = this.dataset.url;
                let current_url = window.location.href;
                history.replaceState({}, '', desired_url);
                history.replaceState({}, '', current_url);
            });

            links[i].parentElement.insertBefore(input, links[i].nextSibling);
        }
    }

    waitForKeyElements('a', test);
})();

Answer 1

您没有提供waitForKeyElements的用例，但是如果我理解正确，您可以将test函数传递给它。如果真是这样-难怪它将X复选框附加到页面上的每个链接。仔细看看：
-您的函数在被调用后会搜索页面中的所有链接，并在其旁边添加一个复选框
-waitForKeyElements根据提供的选择器为找到的每个元素调用该功能。因此，基本上，如果页面有50个链接，则将在每个链接后附加50个复选框。

解决方案是不要在函数中循环，而仅在提供的参数中添加一个复选框：

(function() {
    'use strict';

    function test(element) {
        var input = document.createElement('input');
        input.type = 'checkbox';
        element.parent().append(input);
    }
})();

避免过多的元素

1 个答案: