如何遍歷DIV id元素以檢查樣式None或Block

Question

我想遍歷DIV id元素以檢查樣式是否為無/塊？

要檢查的代碼

 // The below code can perform that but just once. if($('#loadingProgressContainer').css('display') == 'none') { console.log("Display = NONE !!!"); } else { console.log("Display = BLOCK !!"); } //I tried with the below code but not working while ($('#loadingProgressContainer').css('display') != 'none') { console.log("Display = BLOCK !!"); } console.log("Display = NONE !!!"); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="tbNewStyleWrapper" style="position: relative;"> <div id="loadingProgressContainer" style="display: block;"> <div id="loadingProgressElement"> <p><h1>Test Please...</h1></p> <img src="http://www.dev.tasch.co.za/airportshuttle2/components/com_taxibooking/assets/images/ajax-loader-bar.gif"> </div> </div> </div> 

Answer 1

 setInterval(function() { if ($('#loadingProgressContainer').css('display') == 'none') { console.log("Display = NONE !!!"); } else { console.log("Display = BLOCK !!"); } }, 3000); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="tbNewStyleWrapper" style="position: relative;"> <div id="loadingProgressContainer" style="display: block;"> <div id="loadingProgressElement"> <p> <h1>Test Please...</h1> </p> <img src="http://www.dev.tasch.co.za/airportshuttle2/components/com_taxibooking/assets/images/ajax-loader-bar.gif"> </div> </div> </div> 

僅當您要在特定時間段內重復檢查div的可見性時，此代碼段僅供參考

Answer 2

您可以這樣做：

$('div').each(function() {

   /* Check the CSS Display Property and display it in console. */
   console.log($(this).css('display'));
});

Answer 3

如果您需要重復檢查元素的可見性，則可以使用setInterval（） 。 這不是執行此操作的最佳方法，而是一種快速的解決方案。 設置間隔的第二個參數是您希望函數以毫秒為單位運行的頻率。 下面的代碼將每3秒運行一次。

setInterval(function(){ 
   if($('#loadingProgressContainer').css('display') == 'none')
   {
      console.log("Display = NONE !!!");
   }
   else
  {
     console.log("Display = BLOCK !!");
  }
     }, 3000);

Answer 4

$(function() {
$('div').each(function() {
   /* Check the CSS Display Property. */
   console.log($(this));
   console.log($(this).css('display'));
});
});