DOM属性(childNodes, nodeType, nodeValue, nodeName, firstChild, lastChild)

 

childNodes 属性

 element.childNodes 返回一个数组,这个数组包含给定元素节点的全体子元素

var  element  =  document.getElementsByTagName( " ul " );
var  oElement  =  element[ 0 ].childNodes;
for ( var  i  =   0 ; i  <  oElement.length; i ++ ){
  alert(
typeof  oElement[i]);
}

 

 

nodeType 属性

node.nodeType 返回一个数值

nodeType 属性总共有12种可取值,但其中仅有3种具有使用价值:元素节点、属性节点、文本节点的 nodeType 的属性值分别是 1、2、3。

元素节点的 nodeType 属性值是 1。

属性节点的 nodeType 属性值是 2。

文本节点的 nodeType 属性值是 3

var  element  =  document.getElementsByTagName( " ul " );
var  oElement  =  element[ 0 ].childNodes;
for ( var  i  =   0 ; i  <  oElement.length; i ++ ){
  alert(oElement[i].nodeType);
}

 

 

nodeValue 属性

node.nodeValue 检索或设置节点的值

var  text  =  document.getElementsByTagName( " p " );
alert(text[
0 ].childNodes[ 0 ].nodeValue);
text[
0 ].childNodes[ 0 ].nodeValue  =   " OK-value " ;
alert(text[
0 ].childNodes[ 0 ].nodeValue);

 

 

nodeName 属性

node.nodeName 返回一个大写字符串(节点名)

var  name  =  document.getElementsByTagName( " p " );
alert(name[
0 ].nodeName);

 

 

firstChild 属性

node.firstChild 直接访问childNodes[]数组的第一个元素

var  parent  =  document.getElementsByTagName( " p " );
var  child  =  parent[ 0 ].firstChild;
alert(child.nodeValue);

 

 

lastChild 属性

 node.firstChild 直接访问childNodes[]数组的最后一个元素

var  parent  =  document.getElementsByTagName( " p " );
var  child  =  parent[ 0 ].lastChild;
alert(child.nodeValue);

  

 

Examples:

 1  < p > Hello World !< span > OK !!!< / span>< / p >
 2  < script type = " text/javascript " >
 3  <!--
 4  var  element  =  document.getElementsByTagName( " p " );
 5  var  childs  =  element[ 0 ].childNodes;
 6  for ( var  i  =   0 ; i  <  childs.length; i ++ ){
 7      alert(childs[i].nodeType);
 8      i  !=   1   ?  alert(childs[i].nodeValue) : alert(childs[i].childNodes[ 0 ].nodeValue);
 9  }
10 
11  var  first  =  element[ 0 ].firstChild;
12  alert(first.nodeType);
13  alert(first.nodeValue);
14  alert(first.nodeName);
15 
16  var  last  =  element[ 0 ].lastChild;
17  alert(last.nodeType);
18  alert(last.nodeValue);
19  alert(last.nodeName);
20  -->
21  < / script>

 

 

 

 

 

你可能感兴趣的:(DOM属性(childNodes, nodeType, nodeValue, nodeName, firstChild, lastChild))