Home > Developer > JavaScript
Js get the div height and reset the div height and width
Js get the div height and reset the div height and width
<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<Html xmlns = "http://www.111cn.net/1999/xhtml">
<Head>
<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312"/>
<Title> js obtains the div height and resets the div height and width. </title>
<Script language = "javascript tutorial">
Var $ = function (id ){
Return document. getElementById (id );
}
Function clickDiv ()
{
$ ('Testid'). offsetWidth; // 20
$ ('Testid'). offsetHeight; // 200
Document. all. testid. style. width = "1000px"; // js sets the div width
Document. all. testid. style. height = "500px"; // sets the div height to democracy.
// Set the height and width of testid again.
// $ ('Testid'). offsetWidth = 300;
// $ ('Testid'). offsetHeight = 300;
$ ('Testid'). style. className = 'idtest ';
}
</Script>
Method 2
<Script type = "text/javascript">
Alert (document. getElementById ("testid"). scrollHeight + 'px ');
</Script>
Method 3
<Script type = "text/javascript">
Alert (document. getElementById ("testid"). clientHeight + 'px ');
</Script>
<Style type = "text/css tutorial">
# Testid {
Height: 50px;
Width: 200px;
Background: # 3300CC;
}
. Idtest {
Height: 80px;
Width: 150px;
Background: # FFFFFF;
}
</Style>
</Head>
<Body>
<Div id = "testid">
</Div>
<Input type = "button" value = "click" onclick = "clickDiv ();"/>
</Body>
</Html>
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
