HTML DOM - 导航

通过 HTML DOM导航。

HTML DOM 节点列表

getElementsByTagName() 方法返回节点列表数组。

的所有 <p> 节点:

实例

var x=document.getElementsByTagName("p");

个 <p>么写:

y=x[1];

注释:下标号从 0 开始。

HTML DOM 度

length

length 51help.tk

实例

x=document.getElementsByTagName("p");

for (i=0;i<x.length;i++)
{
document.write(x[i].innerHTML);
document.write("<br />");
}

  • 获取所有 <p> 元素节点
  • 输出每个 <p> 节点的值

性:parentNode、firstChild 以及 lastChild 航。

HTML 片段:

<html>
<body>

<p>Hello World!</p>
<div>
  <p>DOM 很有用!</p>
  <p>点关系。</p>
</div>

</body>
</html>
  • 首个 <p> 元素是 <body> 子元素(firstChild)
  • <div> 元素是 <body> (lastChild)
  • <body> <p> 元素和 <div> 点(parentNode)

firstChild 文本:

实例

<html>
<body>

<p id="intro">Hello World!</p>

<script>
x=document.getElementById("intro");
document.write(x.firstChild.nodeValue);
</script>

</body>
</html>

DOM 根节点

  • document.documentElement - 全部文档
  • document.body -

实例

<html>
<body>

<p>Hello World!</p>
<div>
<p>DOM 很有用!</p>
<p>本例演示 <b>document.body</b> 属性。</p>
</div>

<script>
alert(document.body.innerHTML);
</script>

</body>
</html>

childNodes 和 nodeValue

除了 innerHTML 可以使用 childNodes 和 nodeValue 。

获取 id="intro" 的 <p>

实例

<html>
<body>

<p id="intro">Hello World!</p>

<script>
var txt=document.getElementById("intro").childNodes[0].nodeValue;
document.write(txt);
</script>

</body>
</html>

子中,getElementById ,而 childNodes 和 nodeValue 是属性。

用 innerHTML 于对 DOM 51help.tk