javascript - 无法 AppendChild - 尝试使一个方法在不同的类中附加另一个方法

Question

下面的代码在控制台中给出以下消息:

Uncaught DOMException: Failed to execute 'appendChild' on 'Node': The new child element contains the parent

第一个类的 render 方法应该创建一个无序列表，其中有一个子有序列表(在 Counter.render 方法中)，该列表具有直接子级。

    class CounterList {
  constructor(){
   this.counters = [];
  }
  addNewCounter(counter) {
    this.counters.push(this.Counter);
  }
  render() {
    var $ul = $('body').append("<ul></ul>");
    $ul.append(Counter.render);
    return $ul;

  }
}

class Counter {
  constructor() {
    this.name = $("#new-counter-name").val();
    var count = 0;
  }
  decrement() {
    this.count--;
    renderPage();
  }
  increment() {
    this.count++;
    renderPage();
  }
  render() {
    var li = '<li><span>'+this.name+'</span><button>'+this.decrement+'</button><span>'+this.count+'</span><button>'+this.increment+'</button></li>';
    return li;

  }
}

编辑:我意识到我只在返回 $ul 时收到此错误。否则，没有错误，但什么也没有发生。

Answer 1

当你这样做时 var $ul = $('body').append("<ul></ul>");

您的$ul是 body .

你必须做:

var $ul = $('<ul/>').appendTo('body');