Getting global and external style sheet values in IE
First stop- retrieving global and external CSS property values in IE. The key to getting there is through the browser's proprietary "currrentStyle" object, which returns an object that contains the cascaded values of all CSS properties applied to an element. To then get the value of a specific cascaded CSS property, you'd look up that property within the returned object:
<head>
<style type="text/css">
#test{
width: 100px;
height: 80px;
background-color: yellow;
}
</style>
</head>
<body>
<div id="test">This is some text</div>
<script type="text/javascript">
var mydiv=document.getElementById("test")
alert(mydiv.currentStyle.width) //alerts "100px"
alert(mydiv.currentStyle.backgroundColor) //alerts "yellow"
</script>
</body>
As you can see, "currentStyle" exists directly on DOM elements in IE. When retrieving a CSS property value using "currentStyle" , any hyphenated property in CSS (ie: "background-color") must be referenced using its camelCase equivalent instead (ie: "backgroundColor").
And there you have it for IE! Time to move on to Firefox and the gang.
- Tutorial introduction
- Getting global and external style sheet values in IE
- Getting global and external style sheet values in Firefox
- Cross browser function for retrieving global/external CSS properties
