Javascript

<div id="maincontent"><h1>JavaScript HTML DOM</h1><div id="tpn"><ul class="prenext"><li class="pre"><a href="/js/js_form_validation.asp" title="JavaScript 表单验证">JS 验证</a></li><li class="next"><a href="/js/js_htmldom_html.asp" title="JavaScript HTML DOM - 改变 HTML">DOM HTML</a></li></ul></div><div><p><strong>通过 HTML DOM，可访问 JavaScript HTML 文档的所有元素。</strong></p></div><div><h2>HTML DOM （文档对象模型）</h2><p>当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model）。</p><p>HTML DOM 模型被构造为对象的树。</p><h3>HTML DOM 树</h3><img src="/i/ct_htmltree.gif" alt="DOM HTML 树"><p>通过可编程的对象模型，JavaScript 获得了足够的能力来创建动态的 HTML。</p><ul><li>JavaScript 能够改变页面中的所有 HTML 元素</li><li>JavaScript 能够改变页面中的所有 HTML 属性</li><li>JavaScript 能够改变页面中的所有 CSS 样式</li><li>JavaScript 能够对页面中的所有事件做出反应</li></ul></div><div><h2>查找 HTML 元素</h2><p>通常，通过 JavaScript，您需要操作 HTML 元素。</p><p>为了做到这件事情，您必须首先找到该元素。有三种方法来做这件事：</p><ul><li>通过 id 找到 HTML 元素</li><li>通过标签名找到 HTML 元素</li><li>通过类名找到 HTML 元素</li></ul></div><div><h2>通过 id 查找 HTML 元素</h2><p>在 DOM 中查找 HTML 元素的最简单的方法，是通过使用元素的 id。</p><h3>实例</h3><p>本例查找 id="intro" 元素：</p><pre>var x=document.getElementById("intro");</pre><p class="tiy"><a target="_blank" href="/tiy/t.asp?f=js_dom_getelementbyid">亲自试一试</a></p><p>如果找到该元素，则该方法将以对象（在 x 中）的形式返回该元素。</p><p>如果未找到该元素，则 x 将包含 null。</p></div><div><h2>通过标签名查找 HTML 元素</h2><h3>实例</h3><p>本例查找 id="main" 的元素，然后查找 "main" 中的所有 <p> 元素：</p><pre>var x=document.getElementById("main");var y=x.getElementsByTagName("p");</pre><p class="tiy"><a target="_blank" href="/tiy/t.asp?f=js_dom_getelementsbytagname">亲自试一试</a></p><p class="tip"><span>提示：</span>通过类名查找 HTML 元素在 IE 5,6,7,8 中无效。</p></div><div><h2>HTML DOM 教程</h2><p>在本教程接下来的篇幅中，您将学到：</p><ul><li>如何改变 HTML 元素的内容 (innerHTML)</li><li>如何改变 HTML 元素的样式 (CSS)</li><li>如何对 HTML DOM 事件对做出反应</li><li>如何添加或删除 HTML 元素</li></ul></div><div id="bpn"><ul class="prenext"><li class="pre"><a href="/js/js_form_validation.asp" title="JavaScript 表单验证">JS 验证</a></li><li class="next"><a href="/js/js_htmldom_html.asp" title="JavaScript HTML DOM - 改变 HTML">DOM HTML</a></li></ul></div></div>