Question

我正在获得一个以前工作的函数的无限循环 - 我实际上是从stackoverflow文章得到的（我将在下面链接到它）。我不明白为什么我对它做出的微小改变会导致无限循环。

无限循环版

  function walk(node, filter) {
        console.log("value of filter in walk "+ filter + " node: " + node);
        var child, next;
        if(node !== null && filter !== undefined) {

            switch (node.nodeType) {
                case Node.ELEMENT_NODE:  // Element
                case Node.DOCUMENT_NODE:  // Document
                case Node.DOCUMENT_FRAGMENT_NODE: // Document fragment
                    child = node.firstChild;


                while (child) {
                    next = child.nextSibling;
                    walk(child, filter);
                    child = next;
                }

                break;

                case Node.TEXT_NODE: // Text node
                hide(node, filter);
                break;
        }
        }//if statement
    }

工作版

function walk(node) {

    var child, next;

    switch (node.nodeType) {
        case Node.ELEMENT_NODE:  // Element
        case Node.DOCUMENT_NODE:  // Document
        case Node.DOCUMENT_FRAGMENT_NODE: // Document fragment
            child = node.firstChild;
            while (child) {
                next = child.nextSibling;
                walk(child);
                child = next;
            }
            break;

        case Node.TEXT_NODE: // Text node
            hide(node);
            break;
    }
}

我调用这些函数的方式也有所不同 - 对于工作版本，它只是：

walk(document.body);

对于新版本，我有一个函数可以从chrome.storage获取过滤器的值（这只是稍后传递给另一个函数） -

function walkWithFilter(){
    chrome.storage.sync.get('theFilter', function(e){
            var word = e.theFilter;
            console.log(word);
            if(word !== null){
                walk(document.body, word);
            }
        });
}

然而，我也尝试摆脱这个并硬编码过滤器的值，然后将其传递给：

walk(document.body, filter);

这仍然在walk中给出了相同的无限循环，所以我将问题缩小到了walk函数。

这是我从walkfunction获得函数的stackoverflow帖子的链接

****编辑****

这是hide（）函数，它找到＆＃39;过滤器＆＃39; DOM中的单词并隐藏其父元素：

function hide(textNode, filter) {
    var nodeValue = textNode.nodeValue;

    for (var i=0; i < filter.length; i++) {
        if(-1 != nodeValue.indexOf(filter[i])) {
            textNode.parentNode.classList.add('filter');

            //how to change the element by class name (test)
            var x = document.getElementsByClassName('filter');
            var i;
            for (i = 0; i < x.length; i++) {
                console.log("parent length loop");
                x[i].style.backgroundColor = "red";
                 $('.filter').parent().parent().parent().parent().addClass("parent-filter");

                    $('.parent-filter').hide();
                    $('.parent-filter').css("background-color", "black");

                }
             $('.filter').parent().css("background-color", "red");

        }
    }
    textNode.nodeValue = nodeValue;
}

我相信我得到了一个无限循环，因为当我运行脚本时，它不会在walk函数的开头数千次停止打印console.log语句并且崩溃/变得没有响应。如果相关，则适用于Chrome扩展程序。

在DOM函数中无限循环

0 个答案: