Why it doesn't work, style.display

Question

I have a short script. I want to check the visibility oder the Display of a div. But it doesn't work. And i have no idea why, i found some other scripts with the same Code.

I didn't get the message JA

<html>
<head>
<script>
    function test()
    {
        alert('J');
        if (document.getElementById('t').style.visibility == "visible")
        {
            alert('JA');
        }
        if (document.getElementById('t').style.display == "block")
        {
            alert('JA');
        }
    }
</script>
</head>
<body>
<div id = 't'>
    test
</div>
<input type = 'button' onClick = 'test();'>

</body>
</html>

Answer 1

The style property only represents the CSS directives specified in the element's style attribute therefore, both visibility and display will be empty.

What you want is computed style

var t = document.getElementById('t'),
    style = window.getComputedStyle(t);

console.log('visibility', style.visibility);
console.log('display', style.display);

JSFiddle Demo

Why it doesn't work, style.display

Question

1 answers

solution1
3 ACCPTED 2015-08-10 00:38:03

Why it doesn't work, style.display

Question

1 answers

solution1 3 ACCPTED 2015-08-10 00:38:03

solution1
3 ACCPTED 2015-08-10 00:38:03