nextElementSibling冻结firefox

Question

我正在尝试搜索特定文字以突出显示链接。因为链接不在h4标签内，所以我不知道如何解决它。

html代码

<h4>Title P</h4>
...
<h4>Title X</h4>
<p class="item">
<a href="url" target="_new">ABC</a>
</p>
<div class="c">
<p class="item">
<a href="url" target="_new">EFG</a>
</p>
<div class="c">
<p class="item">
<a href="" target="_new">MNO</a>
</p>
<div class="c">
<p class="item">
<a href="url" target="_new">XYZ</a>
</p>
<h4>Title Z</h4>
...

我想找到的文本在其他h4标签下重复，但我想只突出标题X内的那些。

所以这是我的代码：

// @grant       GM_addStyle
...
var h4 = document.getElementsByTagName("h4");

for (var i = 0; i < h4.length ; i++) {

    if (h4[i].textContent.indexOf("Title X") != -1) {

        var links = h4[i].nextElementSibling;

        while (links && links.nodeName != "H4") {

            if (links.textContent.indexOf("EFG") != -1){
                links.setAttribute("id","color");
            }
            if (links.textContent.indexOf("MNO") != -1){
                links.setAttribute("id","color");
            }

        }

    }
}

GM_addStyle ( '                                 \
    #color {                                    \
        background-color: #ffd65e;              \
    }                                           \
' );

如果我删除了，则浏览器不会冻结。

答案后，工作代码为：

var links = h4[i];
while ( (links = links.nextElementSibling) && (links.nodeName != "H4") ) {

            if (links.textContent.indexOf("EFG") != -1) {
                links.setAttribute("id", "color");
            }
...
}

Answer 1

这似乎是您的代码的预期行为。请参阅以下两行。

var links = h4[i].nextElementSibling;
while (links && links.nodeName != "H4") {

您将links设置为当前h4元素后面的元素（在这种情况下，第一个元素，因为它永远不会继续），并反复检查该元素是否真实且不是{ {1}}元素。这个h4语句的正文中没有任何地方重新分配while，因此一遍又一遍地检查相同的方法，从而导致您的悬挂脚本。

我不确定你要对这个脚本做什么，但也许你打算做一些事情来链接这个以迭代兄弟元素？

links