<input type= "button" value= "Restore Style" onclick= "Resetstyle ();"/>
<input type= "button" value= "Modify Style" onclick= "SetStyle ();"/>
1 <!DOCTYPE HTML>2 <HTMLLang= "en">3 <Head>4 <MetaCharSet= "UTF-8">5 <title>Document</title>6 <style>7 Div{8 width:200px;9 Height:200px;Ten background:Red; One } A . Active{ - width:400px; - Height:400px; the background:Blue; - } - </style> - <Script> + functionSetStyle () { - varOBox=document.getElementById ("Box"); + Obox.classname="Active"; A } at functionResetstyle () { - varOBox=document.getElementById ("Box"); - Obox.classname=""; - } - </Script> - </Head> in <Body> - <inputtype= "button"value= "Modify Style"onclick= "SetStyle ();" /> to <inputtype= "button"value= "Restore Style"onclick= "Resetstyle ();" /> + <DivID= "box"></Div> - </Body> the </HTML>
1 <!DOCTYPE HTML>2 <HTMLLang= "en">3 <Head>4 <MetaCharSet= "UTF-8">5 <title>Document</title>6 <style>7 Div{8 width:200px;9 Height:200px;Ten background:Red; One } A </style> - <Script> - functionGetStyle () { the varOBox=document.getElementById ("Box"); - Console.log (CSS (OBox,'Height')); - } - + functioncss (obj,attr) { - //compatible with IE8 and Chrome/ff + if(obj.currentstyle) { A returnobj.currentstyle[attr]; at } Else { - returngetComputedStyle (obj,false) [attr]; - } - } - </Script> - </Head> in <Body> - <inputtype= "button"value= "read"onclick= "GetStyle ();"> to <DivID= "box"></Div> + </Body> - </HTML>
[JS Master's Road first part] JavaScript on hundreds of actual combat "new" _20 read style with classname and shielded empty anchors