要正确计算元素数量

Question

bounty到期在6天内。该问题的答案有资格获得+ 250声望赏金。john c. j.想要引起更多关注来回答这个问题。

我使用waitForKeyElements的waitForKeyElements功能在Brock Adams页面上的链接后创建复选框。

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

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

（Wikipedia的完美工作版本（不具有https://www.google.com/功能：waitForKeyElements）

如何解决？

https://pastebin.com/raw/qkPT2Q7w

Answer 1

您没有提供

// ==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);
})();

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

对于找到的每个元素。因此，基本上，如果页面有50个链接，则将在每个链接之后附加50个复选框。

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

waitForKeyElements