Javascript reads and sets style attributes of document elements

First, let's talk about the style sheet attributes.
1. inline style is set in the element style attribute, with the highest level
2. The page style table definition is defined in the page <style> </style>, followed by the level
3. External link style table File
Javascript gets and sets the CSS attributes of document elements:
1. Get the style attribute set in the element style attribute,
Document. getelementbyid (ID). style. height;
If yes, the property value is returned. If no value is returned, null is returned.
Both IE and Firefox are available, but some attribute values may return different values. For example, Firefox returns RGB, While IE returns hexadecimal numbers.
Test Code :
<SCRIPT type = "text/JavaScript">
Function getcss (){
Alert (document. getelementbyid ("AAA"). style. Height );
Alert (document. getelementbyid ("AAA"). style. backgroundcolor );
Alert (document. getelementbyid ("AAA"). style. width );
Document. getelementbyid ("AAA"). style. backgroundcolor = '# dbdbdbdb ';
// Alert (mywidth );
}
</SCRIPT>
<Div id = "AAA" class = "BBB" style = "height: 20px; Background-color: # ff0000;">
Asdfasdfas
</Div>
<Input type = "button" value = "click" onclick = "getcss ();"/>
2. sometimes our style may be set in multiple places, and we do not know whether it is an external style table attribute or whether it works in an inline style, therefore, we need to obtain the attribute value of the current page rendering. This is somewhat different in IE and FF:
Sample code snippet:
IE: Document. getelementbyid ('aaa'). currentstyle. Height
FF standard: Document. defaultview. getcomputedstyle (AAA, null). getpropertyvalue ('height ')
These two attributes are read-only. If you want to change the element style, you still need to use style, which is directly written in the element style attribute with the highest level of function
3. Write a function compatible with IE and FF to call Copy code The Code is as follows: function getrealstyle (ID, stylename ){
VaR element = Document. getelementbyid (ID );
VaR realstyle = NULL;
If (element. currentstyle)
Realstyle = element. currentstyle [stylename];
Else if (window. getcomputedstyle)
Realstyle = Window. getcomputedstyle (element, null) [stylename];
Return realstyle;
}

call: cur_height = parseint (getrealstyle (con_id, 'height');
p.s: the return value usually has a unit. You need to use the parseint function to extract numbers, to facilitate subsequent operations