Javascript document.getElementById（“myId”）.InnerHTML找不到

我在一些JavaScript代码中遇到了这个问题。我在下面的错误中对其进行了简化，因为我已经能够通过调试查明问题

HTML:

JavaScript:

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

返回了以下错误：TypeError:无法将属性“innerHTML”设置为null。

---

因此，JavaScript似乎无法在那里找到该div。我可以通过删除div并将JS改为getElementByIdcity\u list\u select来解决这个问题，但是我仍然想弄清楚为什么div不能工作，以防将来遇到类似的问题。

嗯。。。我认为在SELECT标记中不能有DIV标记。尝试使用选项标记，或者如您所知，使用SELECT标记的innerHTML替换所有选项标记

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

---

不要忘记，您还可以使用appendChild等方法将新元素附加到现有元素。

JavaScript语句何时/何地执行？当你的JavaScript被执行时，你的元素可能还不存在于DOM中。它将重新排列元素，使其有效。@FelixKling-可能。。。到目前为止，我还没有必要将DIV添加到SELECT标记中，所以我不知道。@FelixKling也许，重要的是，如果给浏览器添加了无效的HTML，结果取决于实现，并且可能会因浏览器而异。但无效XML的结果应完全一致：-@罗布：没错。。。我只是在想，虽然这是一个有效的观点，但更有可能是OP在DOM的这一部分可用之前执行代码。无论如何，问题似乎已经解决了，所以一切都很好：

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