views:

55

answers:

1
<html>
<head>
<style>
#menu{
color :red;
}
</style>
</head>
<body>
<div id="menu">
ABCXTZ
</div>
</body>
<script>
a = document.getElementById('menu');
alert(a.style.color);
</script>
</html

What i retrive just is a empty box.

+4  A: 

To get the computed style you have to go a bit of a different route, like this:

var a = document.getElementById('menu');
if(document.defaultView && document.defaultView.getComputedStyle) {
    alert(document.defaultView.getComputedStyle(a, null).getPropertyValue("color"));
} else if(a.currentStyle) {
    alert(a.currentStyle.color);
}

You can give it a try here, getting .style gets the properties defined on the element itself, not those inherited from the rules it matches. The above uses the getComputedStyle() if available and in the case of IE, falls back to .currentStyle.

Nick Craver