为什么我不能用 Javascript innerHTML 属性 更新 HTML 列表项？

Why can't I update HTML list item with Javascript innerHTML property?

我正在尝试学习 Javascript 并决定自己尝试 innerHTML 属性。但是浏览器似乎忽略了 Javascript 代码。我做错了什么？

 <!DOCTYPE html>
    <html>
      <head>
        <title>JavaScript - Document Object Model </title>

        <meta name="viewport" content="width=device-width, initial-scale=1.0">
      </head>
      <body>
        <div id="page">
          <h1 id="header">List</h1>
          <h2>Buy groceries</h2>
          <ul id="todo">
            <li id="one" class="hot"><em>fresh</em> figs</li>
            <li id="two" class="hot">pine nuts</li><li id="three" class="hot">honey</li>
            <li id="four">balsamic vinegar</li>
         </ul>
       </div>

     <script type="text/javascript">
       var thirdItem = getElementById('three');
       var itemContent = thirdItem.innerHTML;
       thirdItem.innerHTML = '<li id="three" class="hot">chicken</li>';
     </script>
   </body>
  </html>

您的代码应该是：

var thirdItem = document.getElementById('three');
...
thirdItem.innerHTML = 'chicken';

'You might not need jQuery' 是 JavaScript DOM 例程与 jQuery 例程的简短参考。