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);