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

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

本文关键字：HTML 更新 列表 属性 innerHTML 不能 Javascript 为什么      更新时间：2023-09-26

我正在尝试学习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';

"你可能不需要jQuery"是JavaScript DOM例程与jQuery例程的简短参考。

相关文章：