對樣式進行操作
阿新 • • 發佈:2018-11-03
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>對樣式進行操作</title> <style type="text/css"> #div1 { height: 300px; width: 500px; background-color: black; } </style> <script type="text/javascript"> function colorChange(c) { document.getElementById("div1").style.backgroundColor = c; } // function getColor(){ // var i=document.getElementById("div1").style.backgroundColor; // alert(i); // } </script> </head> <body> <!--對樣式進行操作--> <div id="div1"></div> <!--<input type="button" value="獲取當前背景色" onclick="getColor()"/><br />--> <input type="button" value="背景變紅色" onclick="colorChange('red')"><br /> <input type="button" value="背景變褐色" onclick="colorChange('brown')"><br /> <input type="button" value="背景變黑色" onclick="colorChange('black')"><br /> <input type="button" value="背景變綠色" onclick="colorChange('green')"><br /> <input type="button" value="背景變藍色" onclick="colorChange('blue')"><br /><br /> </body> </html>