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>
