We know that the currentStyle attribute can be used in IE to obtain the actual width and height of an element. However, if the width and height of the element are not displayed, this attribute cannot be used and the obtained value is auto. As follows:
Copy codeThe Code is as follows:
<Div> abcd </div>
<Script>
Var div = document. getElementsByTagName ('div ') [0];
Alert (div. currentStyle. width );
Alert (div. currentStyle. height );
</Script>
Auto is output in IE6, 7/8, and 9. If the displayed width and height are set, the actual width and height are output. As follows:
1. Set using the inline style attribute
Copy codeThe Code is as follows:
<Div style = "width: 100px; height: 50px;"> abcd </div>
<Script>
Var div = document. getElementsByTagName ('div ') [0];
Alert (div. currentStyle. width );
Alert (div. currentStyle. height );
</Script>
2. Set style labels through page embedding
Copy codeThe Code is as follows:
<Style>
Div {
Width: 100px;
Height: 50px;
}
</Style>
<Div> abcd </div>
<Script>
Var div = document. getElementsByTagName ('div ') [0];
Alert (div. currentStyle. width );
Alert (div. currentStyle. height );
</Script>
Will output: 100px, 50px