
_START_ARTICLE_
動態HTML
_START_SECTION_
结构
_START_PARAGRAPH_
一个典型的使用DHTML 如下:_NEWLINE_<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"><html xmlns="http://www.w3.org/1999/xhtml">_NEWLINE_  <head>_NEWLINE_    <title>DHTML example</title>_NEWLINE_    <script type="text/javascript"> _NEWLINE_      function init() {_NEWLINE_      myObj = document.getElementById("navigation");_NEWLINE_      // .... more code_NEWLINE_      }_NEWLINE_      window.onload=init;_NEWLINE_    </script>_NEWLINE_  </head>_NEWLINE_  <body>_NEWLINE_    <div id="navigation"></div>_NEWLINE_    <pre>_NEWLINE_      Often the code is stored in an external file; this is done by linking the file that contains the JavaScript. _NEWLINE_      This is helpful when several pages use the same script:_NEWLINE_    </pre>_NEWLINE_    <script type="text/javascript" src="myjavascript.js"></script>_NEWLINE_  </body></html>
_START_SECTION_
示例
_START_PARAGRAPH_
示例如下：_NEWLINE_<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"       "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">_NEWLINE_  <head>_NEWLINE_    <title>Test</title>_NEWLINE_    <style type="text/css">_NEWLINE_      h2 {background-color: lightblue; width: 100%}_NEWLINE_      a {font-size: larger; background-color: goldenrod} _NEWLINE_      a:hover {background-color: gold}_NEWLINE_      #example1 {display: none; margin: 3%; padding: 4%; background-color: limegreen}_NEWLINE_    </style>_NEWLINE_    <script type="text/javascript">_NEWLINE_      function changeDisplayState (id) {_NEWLINE_        d=document.getElementById("showhide");_NEWLINE_        e=document.getElementById(id);_NEWLINE_        if (e.style.display == 'none' || e.style.display == "") {_NEWLINE_          e.style.display = 'block';_NEWLINE_          d.innerHTML = 'Hide example..............';_NEWLINE_        } else {_NEWLINE_          e.style.display = 'none';_NEWLINE_          d.innerHTML = 'Show example';_NEWLINE_        }_NEWLINE_      }_NEWLINE_    </script>_NEWLINE_  </head>_NEWLINE_  <body>_NEWLINE_    <h2>How to use a DOM function</h2>_NEWLINE_    <div><a id="showhide" href="javascript:changeDisplayState('example1')">Show example</a></div>_NEWLINE_    <div id="example1">_NEWLINE_      This is the example._NEWLINE_      (Additional information, which is only displayed on request)..._NEWLINE_    </div>_NEWLINE_    <div>The general text continues...</div>_NEWLINE_  </body></html>