JavaScript的DOM编程--03--读写属性节点

读写属性节点:

1)可以直接通过 cityNode.id 这样的方式来获取和设置属性节点的值

2)通过元素节点的 getAttributeNode 方法来获取属性节点,

然后在通过 nodeValue 来读写属性值

 1 <html>
 2     <head>
 3         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 4         <title>Untitled Document</title>
 5         
 6         <script type="text/javascript">
 7             
 8             //读写属性节点: 通过元素节点 . 的方式来获取属性值和设置属性值. 
 9             window.onload = function(){
10                 
11                 //属性节点即为某一指定的元素节点的属性. 
12                 //1. 先获取指定的那个元素节点
13                 var nameNode = document.getElementById("name");
14                 
15                 //2. 再读取指定属性的值
16                 alert(nameNode.value);
17                 
18                 //3. 设置指定的属性的值.
19                 nameNode.value = "尚硅谷";
20                 
21                 //var nameAttr = nameNode.getAttributeNode("value");
22                 //alert(nameAttr);
23                 //alert("--" + nameAttr.nodeValue);
24                 //nameAttr.nodeValue = "atguigu";
25             }
26             
27         </script>
28         
29     </head>
30     <body>
31         <p>你喜欢哪个城市?</p>
32         <ul >
33             <li  name="BeiJing">北京</li>
34             <li>上海</li>
35             <li>东京</li>
36             <li>首尔</li>
37         </ul>
38         
39         <br><br>
40         <p>你喜欢哪款单机游戏?</p>
41         <ul >
42             <li >红警</li>
43             <li>实况</li>
44             <li>极品飞车</li>
45             <li>魔兽</li>
46         </ul>
47         
48         <br><br>
49         name: <input type="text" name="username" 
50              value="atguigu"/>
51     </body>
52 </html>