第五节 JavaScript属性操作

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Document</title>
 6     <script type="text/javascript">
 7         window.onload = function(){
 8             var oDiv = document.getElementById('div1');
 9             var oA = document.getElementById('link');
10             var oDiv2 = document.getElementById('div2');
11             // 读取属性
12             var sId = oDiv.id;
13             alert(sId);
14             // 写属性
15             oDiv.style.color = 'red';
16             oA.href = "http://www.baidu.com";
17             oA.title = '这是去百度的链接'
18             oDiv2.className = 'box2'
19             // 操作class属性在JavaScript需要写成class.Name
20             // style属性里的属性，有横杆的改成驼峰式，font-size 改成 fontSize
21         }
22     </script>
23 
24     <style type="text/css">
25         .box{
26             font-size: 30px;
27             color: gold;
28         }
29         .box2{
30             font-size: 10px;
31             color: blue;
32         }
33     </style>
34 </head>
35 <body>
36     <div id='div1'>这是一个div元素</div>
37     <!-- a.#link -->
38     <a href="#" class="" id="link">这是一个链接</a>
39     <div class="box" id="div2">这是第二个div</div>
40 </body>
41 </html>