Question

我想循环遍历DIV id元素，以便检查样式是否为none / block？

要检查的代码

＆＃13;

// 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 !!!");

＆＃13;

<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>

＆＃13;

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'));
});
});

如何遍历DIV id元素以检查样式None或Block

4 个答案: