js does not read style from css

BubikolRamios

11-22-2012, 10:15 AM

I would expect that alert would pop up 'none'.
How to solve that ?

<!DOCTYPE html>
<html>
<head>

<style type="text/css">

.myclass
{
display:none;
}
</style>

<script>
function demoDisplay()
{
alert(document.getElementById("p1").style.display);
}

</script>
</head>
<body>

<p id="p1" class = 'myclass'>This is some text.</p>

<input type="button" onclick="demoDisplay()" value="see if js can get me style from css">

</body>
</html>

devnull69

11-22-2012, 10:27 AM

There is getComputedStyle() together with getPropertyValue(). The .style property will only get inline styles btw.

var element = document.getElementById('p1');
alert(window.getComputedStyle(element, null).getPropertyValue('display'));