如何使元素的可见度.hide(), .show(),或.toggle()?

如果一个元素是visiblehidden?


当前回答

content.style.display != 'none'

function toggle() {
  $(content).toggle();
  let visible= content.style.display != 'none'
  console.log('visible:', visible);
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<button onclick="toggle()">Show/hide</button>
<div id="content">ABC</div>

其他回答

您可以在显示或隐藏 CSS 类时使用该类的 CSS 类 :

.show{ display :block; }

设置您的j查询toggleClass()addClass()removeClass();.

例如,

jQuery('#myID').toggleClass('show')

上述代码将添加show当元素没有 cs 元素时 cs 类show当它消逝的时候,show类。

当你在检查它是否可见, 你可以遵循这个 JQuery 代码,

jQuery('#myID').hasClass('show');

上面的代码将返回布尔值( true) 时返回布尔值#myID元素中含有我们的类(show当它没有的时候,是假的,show类。

$('someElement').on('click', function(){ $('elementToToggle').is(':visible')

如果隐藏在类 - d - no 类中

if (!$('#ele').hasClass('d-none')) {
        $('#ele').addClass('d-none'); //hide 

    }


  

你可以试试这个

$(document).ready(function() {
   var view = $(this).is(':visible');

   if(view) {
      alert("view");
                    // Code
   }
   else
   {
      alert("hidden");
   }
});

这些答案都没有涉及我所理解的问题,这就是我所寻求的,"我如何处理那些visibility: hidden?"两者都不是:visible:hidden将处理此事宜, 因为他们都在查找文档中的显示。 就我所能确定的情况来看, 没有选择器可以处理 CSS 可见度 。 以下是我如何解决这个问题的( 标准 jQuery 选择器, 可能有更压缩的语法 ) :

$(".item").each(function() {
    if ($(this).css("visibility") == "hidden") {
        // handle non visible state
    } else {
        // handle visible state
    }
});