【译文】如何使用JavaScript动态写html

使用JavaScript实现HTML动态代码

最简单的方法是使用innerHTML 属性改变一个HTML元素的内容。innerHTML属性获得或者设置一个元素里面的HTML或者XML标记内容。依靠使用这个属性,所有现代版浏览器都支持,我们可以设计任何内容元素的新的HTML或文本内容,页面可以及时更新并且随时显示新内容。

document.getElementById('test').innerHTML="This is heading using JavaScript";
This will change…


源程序

<html>
  <body>
    <div id="test"><b>This will change...</b></div>
    <button onclick="changeIt()">Change....</button>
    <script>
      function changeIt() {
        document.getElementById('test').innerHTML="Changed using innerHTML!!";
      }
    </script>
  </body>
</html>

例子讲解:

上面包含div元素的HTML文档,有 id=”test”。用HTML的DOM使用id=”test”获得元素。 JavaScript 改变了这个元素的内容(innerHTML)为”Changed using innerHTML!!”

DOMString 包括元素子元素的 HTML序列化 。设置innerHTML的值,将移除所有元素的子元素,并且通过解析给定的htmlString利用结构节点去替换。它被广泛应用在网页里面,用以产生动态html,例如注册窗体,留言窗体,链接等等。

JavaScript教程



此条目发表在博客, 服务器, 程序开发, 计算机安全分类目录,贴了, , , , , , 标签。将固定链接加入收藏夹。