1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title></title> 5 <script type="text/javascript"> 6 7 /* 8 CSS DOM 使用JS操作CSS中的属性 9 每个HTML标记, 都有一个style属性, 也是一个style对象 10 style中的属性和CSS中属性一一对应 11 12 属性转换: 13 如果是一个单词, style对象属性与CSS属性一样 14 如果是多个单词, 第一个单词全小写, 后面每个单词首字母大写 15 */ 16 window.onload = function () { 17 18 // 获取img元素 19 var imgObj = document.getElementById("img01"); 20 21 // 添加行内样式 22 imgObj.style.width = "200px"; 23 imgObj.style.border = "1px solid red"; 24 imgObj.style.padding = "20px"; 25 imgObj.style.backgroundColor = "blue"; 26 27 } 28 </script> 29 </head> 30 <body> 31 32 <img id="img01" src="images/003.png"> 33 34 </body> 35 </html>