javascript - 将新的嵌套 div 添加到文档

Question

我想在文档中添加一个带有子 div 的 div，但是 append() 似乎是错误的选项，我应该使用什么来代替？

  //Create Statusbar
  var status = $('#status');
  for (var i = 0; i < resources.length; i++) {
    var resource = document.createElement('div');
    var resourceCounter = document.createElement('div');
    resourceCounter.id = "r" + (i + 1);
    //resource.className = "resource";
    resource.innerHTML = resources[i];
    resourceCounter.innerHTML = saveData.resources ? saveData.resources[i] : 0;
    resource.style.background = "url('images/resources/" + resource.id + ".jpg') 0 26px / 100% auto no-repeat";
    resource.onclick = function () {
      alert(this.id);
    };
    resource.append(resourceCounter);
    status.append(resource);
  }

resource.append(resourceCounter);--> Uncaught TypeError: Object #HTMLDivElement has no method 'append'

Answer 1

这里的resource是一个dom元素，append是jQuery提供的一个方法，在dom元素中是不存在的

您可以改用appendChild

resource.appendChild(resourceCounter);

或用 jQuery 包装资源并使用 append

$(resource).append(resourceCounter);