JS节点的属性: nodeType, nodeName, nodeValue

 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

 2 <html>

 3     <head>

 4         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

 5         <title>Untitled Document</title>

 6         

 7         <script type="text/javascript">

 8             

 9             //关于节点的属性: nodeType, nodeName, nodeValue

10             //在文档中, 任何一个节点都有这 3 个属性

11             //而 id, name, value 是具体节点的属性. 

12             window.onload = function(){

13                 

14                 //1. 元素节点的这 3 个属性

15                 var bjNode = document.getElementById("bj");

16                 alert(bjNode.nodeType); //元素节点: 1

17                 alert(bjNode.nodeName); //节点名: li

18                 alert(bjNode.nodeValue); //元素节点没有 nodeValue 属性值: null

19                 

20                 //2. 属性节点

21                 var nameAttr = document.getElementById("name")

22                                        .getAttributeNode("name");

23                 alert(nameAttr.nodeType); //属性节点: 2

24                 alert(nameAttr.nodeName); //属性节点的节点名: 属性名

25                 alert(nameAttr.nodeValue); //属性节点的 nodeValue 属性值: 属性值

26                 

27                 //3. 文本节点:

28                 var textNode = bjNode.firstChild;    

29                 alert(textNode.nodeType); //文本节点: 0

30                 alert(textNode.nodeName); //节点名: #text

31                 alert(textNode.nodeValue); //文本节点的 nodeValue 属性值: 文本值本身. 

32             

33                 //nodeType、nodeName 是只读的.

34                 //而 nodeValue 是可以被改变的。 

35                 //以上三个属性, 只有在文本节点中使用 nodeValue 读写文本值时使用最多. 

36             }

37             

38         </script>

39         

40     </head>

41     <body>

42         <p>你喜欢哪个城市?</p>

43         <ul id="city">

44             <li id="bj" name="BeiJing">北京</li>

45             <li>上海</li>

46             <li>东京</li>

47             <li>首尔</li>

48         </ul>

49         

50         <br><br>

51         <p>你喜欢哪款单机游戏?</p>

52         <ul id="game">

53             <li id="rl">红警</li>

54             <li>实况</li>

55             <li>极品飞车</li>

56             <li>魔兽</li>

57         </ul>

58         

59         <br><br>

60         name: <input type="text" name="username" 

61             id="name" value="atguigu"/>

62     </body>

63 </html>    

 

你可能感兴趣的:(value)