Modify style
1. Get the object:
var oBox = document.getElementById("元素id");
2, after getting the object, pass
object.style.property name = property value
onmouseover->onmouseout
onmouseout->onmouseover
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <style> 7 div { 8 width: 200px; 9 height: 200px; 10 background-color: red; 11 } 12 </style> 13 <script> 14 function toBig() { 15 var oBox=document.getElementById('box'); 16 oBox.style.width='400px'; 17 oBox.style.height='400px'; 18 oBox.style.backgroundColor='blue'; 19 } 20 function toSmall() { 21 var oBox=document.getElementById('box'); 22 oBox.style.width='200px'; 23 oBox.style.height='200px'; 24 oBox.style.backgroundColor='red'; 25 } 26 </script> 27 </head> 28 <body> 29 <div id="box" onmouseover="toBig()"; onmouseout="toSmall()">div变样式3</div> 30 </body> 31 </html>