<script type="text/javascript">
//<![CDATA[
function $(obj)
{
return (obj);
}
function getStyle(obj,styleName)
{
if() //for ies
{
return [styleName]; // Pay attention to the acquisition method
}
else //for others
{
return (obj,null).getPropertyValue(styleName);
//return (obj,null)[styleName];
}
}
$('btnGetClick').onclick=function()
{
//The embedded style written directly on the tag is the inner style, the inner style written in the head-style, and the outer style introduced by the link is the outer style
//Inline styles can be obtained through the . style name. It should be noted that the style name is camel format
//The internal style and external style cannot be obtained through style. The style name cannot be obtained, and it needs to be obtained through currentStyle || getComputedStyle
//In fact, this is easy to understand. When embedded styles, the tag has the style attribute (the property value returns an object object), so we can get it through the style. style name
//When internal or external, although there is a style attribute, the corresponding value is empty, so it can only be obtained through currentStyle || getComputedStyle
//alert($('div2').style); You can see that the pop-up result is object, indicating that the style exists, but the corresponding style below is set to empty.
$('testContent').innerHTML='';
var str=$('div'). || $('div').; //Because float is a reserved word, it cannot be used, but ies:styleFloat, ff:cssFloat
str=str+($('div').+'<br />');
str=str+($('div2').+' <br />'); //This paragraph cannot obtain the internal style and displays null values, but it does not mean that the style does not exist
str=str+($('div2').width+' <br />'); //Return undefined because the width property is not set for the dom of div2
str=str+getStyle($('div2'),'width'); //The style of div2 is provided through the internal style, so it is obtained through currentStyle || getComputedStyle
$('testContent').innerHTML=str;
}
$('btnUpdateClick').onclick=function()
{
//When setting styles, whether it is embedded, internal or external, you can get the style attribute (object) in these three ways.
// Then you can use it to set styles for elements. There are three ways to set styles.
$('div').='200px';
$('div2').='100px';
$('div').='background:blue;color:red;font-weight:bold;'; //The original definition will be overwritten, which is equivalent to the definition style="background:blue;font-size:red;font-weight:bold;"
$('div2').className='testClassName'; //Equivalent to setting <div class="testClassName" />
}
//]]>
</script>