document.getElementById（“myId”）。InnerHTML找不到<div id=“myId”>

Question

我遇到了一些JavaScript代碼的問題。 我在下面的錯誤中簡化了它，因為我已經能夠通過調試來查明問題。

HTML：

<select id="city_list_select" name="city">
    <div id="clist">
        <option>Select a Region First</option>
    </div>
</select>

JavaScript的：

document.getElementById("clist").innerHTML = "<option>Test</option>";

我收到此錯誤：TypeError：無法設置null的屬性'innerHTML'。 所以似乎JavaScript無法在那里找到那個div。 我能夠通過刪除div並將JS更改為getElementById（“city_list_select”）來解決這個問題，但是我仍然想知道為什么div在以后遇到類似問題時無效。

Answer 1

嗯......我認為你不能在SELECT標簽里面有一個DIV標簽。 嘗試使用OPTION標記，或者如您所知，使用SELECT標記的innerHTML替換所有OPTION標記。

<select id="city_list_select" name="city">            
  <option id="option1">Select a Region First</option>     
</select>

並且不要忘記您還可以使用appendChild方法將新元素附加到現有元素。