Javascript 为什么array.forEach（）在这段代码中什么都不做？

我试图显示按距离排序的搜索容器的结果（比较我和每个div的数据之间的距离）。除了

resultArray.forEach（…）

如注释中所述，
mainDiv.appendChild（el）
将导致类似于

TypeError:Node.appendChild的参数1未实现接口节点

因为需要引用数组中的元素才能将其附加到DOM中。另外，
resultArray
仅在
search（）
方法找到匹配项时才会填充元素。所以对我来说，在条件中移动代码块是有意义的。如果没有html，就不可能准确地确定代码应该如何工作，但下面是我尝试的（某种程度上）工作娱乐：）


var btnSearch=document.getElementById（“btnSearch”）；
var mainDiv=document.getElementById（“mainDiv”）；
var d=1；
btnSearch.addEventListener（“单击”，函数（e）{
var inputBuscadorValue=inputBuscador.value；
var infoDivBuscador=document.getElementsByClassName（“div info”）；//mainDiv子级的子级
var resultArray=[]；
Array.prototype.forEach.call（infoDivBuscador，函数（f）{
if（f.innerHTML.toLowerCase（）.search（inputBuscadorValue.toLowerCase（））=-1）{
f、 parentNode.style.display=“无”；
}否则{
mainDiv.style.display='none'；
//它在这里计算距离（它起作用）；
控制台日志（f）；
结果推送({
元素：f.parentNode，
距离：d
});
resultArray.sort（函数（a，b）{
返回a.distance-b.distance
});
mainDiv.innerHTML=“”；
resultArray.forEach（函数（el）{
主分区子元素（el.element）；
控制台日志（el）；
});
mainDiv.style.display='block'；
}
}，假）；
});

搜寻
新闻组1
新闻组2
新闻组3
新闻组4
执行
console.log（resultArray）显示填充的数组？如果是的话，你能做一个决定吗？（理想情况下，将一个实时片段编辑到问题中，或者如果您无法管理，请链接到JSFIDLE或其他东西，以便其他人可以）@CertainPerformance它显示了数据重新排序的数组。如果您查看浏览器控制台，错误应该非常清楚：
uncaughttypeerror:未能在“节点”上执行“appendChild”：参数1不是“节点”类型。
（在询问原因之前，请始终检查控制台是否存在错误）resultArray不是HTML元素数组-因此
mainDiv.appendChild（el）不会做任何事情（除了抛出我怀疑的错误）。。。你的意思是
mainDiv.appendChild（el.element）
@CertainPerformance我猜对元素的引用被破坏了，因此
f.style…
没有任何影响，但这仍然是我的猜测
btnSearch.addEventListener("click", function(e){
    var inputBuscadorValue = inputBuscador.value;
    var infoDivBuscador = document.getElementsByClassName("div-info"); //a child of a child of mainDiv

    var resultArray = [];

    Array.prototype.forEach.call(infoDivBuscador , function(f){
        if (f.innerHTML.toLowerCase().search(inputBuscadorValue.toLowerCase()) == -1){
            f.parentNode.style.display = "none";
          }else{
            mainDiv.style.display = 'none';

            //It calculates the distance here (it works);                 

             resultArray.push({
               element: f.parentNode,
               distance: d
             });

        });

       resultArray.sort(function(a, b){return a.distance - b.distance});
       console.log(resultArray);

        mainDiv.innerHTML = "";

        resultArray.forEach(function(el) {
          mainDiv.appendChild(el);
          console.log(el); //doesn't log any
        })

        mainDiv.style.display = 'block';

}, false);