Js method for getting inline styles, js inline styles
This article describes how to obtain inline styles in js. Share it with you for your reference. The specific implementation method is as follows:
Copy codeThe Code is as follows: <! DOCTYPE html>
<Html lang = "en">
<Head>
<Meta charset = "UTF-8">
<Meta name = "viewport" content = "width = device-width, target-densitydpi = high-dpi, initial-scale = 1.0, minimum-scale = 1.0, maximum-scale = 1.0, user-scalable = no "/>
<Title> obtain inline styles using javascript </title>
</Head>
<Style>
# Box {
Width: 100px;
Height: 100px;
Background-image: url(1.jpg );
Background-size: 140% 140%;
Background-repeat: no-repeat;
Border: 20px solid rgba (0, 0,. 3 );
Background-clip: border-box;
Background-position:-20px-20px;
}
</Style>
<Body>
<Div id = "box"> </div>
</Body>
</Html>
<Script>
// Obtain inline style elements
Function getStyle (obj, attr)
{
If (window. getComputedStyle ){
Return getComputedStyle (obj, null) [attr];
} Else {
Return obj. currentStyle [attr];
}
}
// Obtain the object
Function $ (id ){
Return document. getElementById (id );
}
Var box = $ ('box ');
// Print the style
Alert (getStyle (box, 'background-position '));
</Script>
I hope this article will help you design javascript programs.