JavaScript .style.display？

Question

我想從HTML元素中獲取display屬性。 當我編寫內聯CSS時，它可以工作，但是如果我使用類，它就不會。

這有效：

<p id="p1" style="display:none;">This is some text.</p>​
<script>alert(document.getElementById("p1").style.display);</script>

http://jsfiddle.net/bwzAN/2/

這不起作用：

<style>.deneme{ display: none; }​</style>
<p id="p1" class="deneme">This is some text.</p>​
<script>alert(document.getElementById("p1").style.display);</script>

http://jsfiddle.net/bwzAN/7/

為什么？ 是否有可能使第二種情況像第一種情況一樣？ 我該如何解決？

Answer 1

嘗試使用getComputedStyle() - DEMO

$(document).ready(function(){
    var elem = document.getElementById("p1");
    var st   = window.getComputedStyle(elem, null).getPropertyValue("display");

    alert( st );
});

Answer 2

看看getComputedStyle（）/ getPropertyValue（）。 屬性.style.display將僅返回您已提到的內聯樣式屬性。

var yourDisplay = window.getComputedStyle(document.getElementById('yourID'), null).getPropertyValue('display');

Answer 3

您需要獲得“計算樣式”（即“最終結果”）而不是您的設置。

我已經創建了一個JSFiddle（你的非工作原文的一個分支）來幫助你： http ： //jsfiddle.net/Jamesking56/qTKYK/2/