javascript - 收到错误 : Failed to execute 'appendChild' on 'Node' : parameter 1 is not of type 'Node'

Question

我以前在这里见过遇到这个问题的人，但没有一个答案能帮助我更好地理解我的问题。

我有一个排序函数，它不是对附加到 DOM 的元素进行排序，而是在控制台中给出错误:无法在“节点”上执行“appendChild”:参数 1 不是“节点”类型.

我不明白为什么它不能将对象附加到 DOM，因为它们属于不同类型。

function sorting(){
  $('#sort_by a').click(function(e){
    var sortAttr = $(this).attr('href').slice(1);
    e.preventDefault()

    var bands = $('#results').children();

    bands.sort(function (a, b) {
      if ($(a).attr(sortAttr) > $(b).attr(sortAttr)){
      return 1;
    }
    if ($(b).attr(sortAttr) > $(a).attr(sortAttr)){
      return -1;
    }
    return 0;
  });

  var appendAnim = function(items, index){
    $(items[index]).hide();
    $(items[index]).fadeIn(500);

    document.getElementById('results').appendChild(items[index])

    if(index < items.length ){
      appendAnim(items,index + 1);
    }
  }

  appendAnim(bands,0)
  return false;

  });
};

Answer 1

您混淆了 jQuery DOM 对象和原生 javascript DOM 对象。

jQuery 选择器返回的 DOM 对象(在你的例子中是 $('#results').children() )是由 jQuery 创建的对象，它不同于 javascript DOM 对象。因此，您不能在 native javascript 方法 .appendChild(Node) 中使用它

由于您使用的是 jQuery，因此我建议您使用 .append() 方法，因此请更改此

document.getElementById('results').appendChild(items[index])

为此:

$("#results").append(items[index])