Javascript .innerHTML僅影響父div

Question

我的代碼應該創建一個新游戲，您可以自定義學生，而其他則不能。 這不是問題，當您加載游戲或完成自定義后，會出現錯誤。 無論出於什么原因，我的圖片都無法加載。 它甚至也不會編輯我要更改的元素。 這是應該工作的更新/運行代碼：

function startUp() {
  if (saving) {
    $('#newGame-settings').fadeOut(500);
    setTimeout(function() {
      $("#mainScreen").fadeIn(1500);
    }, 500);
    saving = false;
  } else {
    $('#Start_Menu_Container').fadeOut(500);
    setTimeout(function() {
      $("#mainScreen").fadeIn(1500);
    }, 500);
  }


  var container = "";
  for (var i = 0; i < students.length; i++) {
    container += ("<div class='studentListC' style='background-image: url(\"" + students[i].imgSrc + "\")'>" + students[i].name + "</div>");
  }
  var studentList = document.getElementById("studentList");
  studentList.innerHTML = container;
}

它應該只顯示它​​的主屏幕，然后編輯studentList id元素。 它沒有 。 如果有人可以幫助我，那就太好了！

另外，可能有用的一點是，如果我這樣做，它將添加到mainScreen id（studentList的父元素）中，除了圖片仍然沒有顯示之外，它的工作方式還可以。 因此，樣式中的字符串也可能有錯誤。

鏈接到所有代碼： http : //jsbin.com/joneyi/edit?html,css,js,output

Answer 1

在問候它不填充studentList元素的問題，它實際上是填充一個 studentList元素，只是沒有你想要的（還有叫studentList在頁面上隱藏的div的人。我相信，你只需要確保你是選擇mainPage元素下的studentList元素（請原諒我未提供執行此操作的代碼，但我對JavaScript語法有些不滿。）

至於圖像，我認為問題是嵌套的雙引號：

<div class="studentListC" style="background-image: url("https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcQy51udfhp-M17O5xe9wdQNpzq-Rf34cLMcCZ9hqkOIF2PEyKKa")">Brayton</div>

我看到您的代碼實際上是對整個style屬性使用單引號，但是我認為它們可能會在某處轉換為雙引號（可能是隱式轉換？）。無論如何，請嘗試使用單引號將url值括起來。