无法将搜索结果放入超链接并附加到 div答案

【问题标题】：Can't put search results into Hyperlinks and append to a div无法将搜索结果放入超链接并附加到 div
【发布时间】：2011-08-20 16:42:55
【问题描述】：

好的，我遇到了一个简单的 javascript 代码，它可以搜索页面中的所有超链接，运行速度非常快。唯一的问题是浏览器在尝试在 div 中重新制作这些链接时冻结，只要我按下浏览器拒绝加载的按钮就没有错误。正如您所看到的，它从表单获取输入，然后在每个超链接中搜索这些术语，然后应该使用链接填充 div，但事实并非如此。代码如下。

function search0(){
var lists = document.getElementsByTagName("a");
for (var i = 0; i < lists.length; i++) {

var output = lists[i];
var team1 = document.getElementById("search1").value;
var matchPos1 = output.innerHTML.search(team1);

if(matchPos1 != -1){

var team2 = document.getElementById("search2").value;   
var matchPos2 = output.innerHTML.search(team2);

    if(matchPos2 != -1){

    var elem1 = document.createElement("a")
        var styleattr=document.createAttribute("href");
        styleattr.nodeValue=output;
        elem1.setAttributeNode(styleattr);  
    var text1 = document.createTextNode(output.innerhtml);
        elem1.appendChild(text1);
    var parentdiv = document.getElementById("frame2");
    parentdiv.appendChild(elem1);
    }
}
}
}

【问题讨论】：

标签： javascript dom hyperlink

【解决方案1】：

您正在创建一个无限循环。
您使用 document.getElementsByTagName("a") 创建的 nodeList 是实时的，即如果您向页面添加链接，它将自动出现在此列表中！是的，没错，即使没有重新查询。 Here's a reference doc。

您正在向 nodeList 添加链接，然后将其匹配并添加到 nodeList 的末尾，然后匹配等等

要做你想做的事，你应该像这样创建一个初始链接数组。

//creates a real js array from a nodelist
var list = Array.prototype.slice.call( document.getElementsByTagName("a"), 0 );

这是explanation of Array.prototype.slice.call

【讨论】：

哦，你是个传奇，非常感谢你把我的头发扯掉了。
我今天遇到了一个问题，和往常一样，这段代码在 ie 7 中不起作用。有解决办法吗？

【解决方案2】：

还要更改区分大小写的错误：

var text1 = document.createTextNode(output.innerhtml);

到

var text1 = document.createTextNode(output.innerHTML);

【讨论】：