element.firstChild

摘要

返回当前元素第一个子元素, 如果元素没有子元素返回 null.

语法

childNode = node.firstChild;

如果node有子元素,childNode 是 node第一个子元素的引用, 否则为 null.

范例

这个例子示范使用 firstChild 和以及空白符结点会对使用此属性造成何种影响。参见 注意 部分获取 Gecko DOM 关于空白符的更多信息.

<p id="para-01">
  <span>First span</span>
</p>

<script type="text/javascript">
  var p01 = document.getElementById('para-01');
  alert(p01.firstChild.nodeName)
</script>

在上面的示例中, 提示将显示 '#text' 因为一个文本节点被插入表示开始 <p> 和　<span> 标记之间的空白空间. 任意 的空白都将导致 #text 节点的插入, 包括一个到多个空格符,换行符,制表符等等.

另一个#text 节点被插入到结束</span> 和 </p>标记之间.

如果从源代码移出空白空间, #text 节点将不被插入, span 元素将变成第一个子节点.

<p id="para-01"><span>First span</span></p>

<script type="text/javascript">
  var p01 = document.getElementById('para-01');
  alert(p01.firstChild.nodeName)
</script>

现在提示将显示 'SPAN'.

注意

Gecko 内核的浏览器会在源标记中有空白符的地方插入一个文本结点到文档中。因此使用如 firstChild 和 previousSibling 之类的方法可能会引用到一个空白符文本结点，而不是使用者所预期得到的元素。

1.xml的格式：

===============

out.println("<reponse>");

out.println("<message> <state>hi </state><state>hello</state></message>");

out.println("<flag>"+sflag+"</flag>");

out.println("</reponse>");

即格式为：

<reponse>

<message>

<state>hi</state>

<state>hello</state>

</message>

<flag>hello

</flag>

</reponse>

2.再jsp中、

==============

var xmlDoc=xmlHttp.responseXML;

【1】var mes=xmlDoc.getElementsByTagName("message")[0].childNodes[1].childNodes[0].nodeValue;

alert(mes);//得到hello

【2】var mes=xmlDoc.getElementsByTagName("message")[0].childNodes[0].childNodes[0].nodeValue;

alert(mes);//得到hi

【3】var mes=xmlDoc.getElementsByTagName("message")[0].childNodes[1].firstChild.nodeValue;//得到hello

【4】var val=xmlDoc.getElementsByTagName("flag")[0].firstChild.data;

【5】var val=xmlDoc.getElementsByTagName("flag")[0].childNodes[0].nodeValue;

其中【1】【3】是相同效果，【4】【5】相同效果，

也就是说，firstChild等价于childNodes[0];nodeValue等价于data