如何使用 . hide () 、.show () 或.toggle () 来切换元素的可见度 ?
如果元素可见或隐藏, 我如何测试 ?
当前回答
hideShow(){
$("#accordionZiarat").hide();
// Checks CSS content for display:[none|block], ignores visibility:[true|false]
if ($("#accordionZiarat").is(":visible")) {
$("#accordionZiarat").hide();
}
else if ($("#accordionZiarat").is(":hidden")) {
$("#accordionZiarat").show();
}
else{
}
其他回答
hideShow(){
$("#accordionZiarat").hide();
// Checks CSS content for display:[none|block], ignores visibility:[true|false]
if ($("#accordionZiarat").is(":visible")) {
$("#accordionZiarat").hide();
}
else if ($("#accordionZiarat").is(":hidden")) {
$("#accordionZiarat").show();
}
else{
}
这些答案都没有涉及我所理解的问题, 也就是我正在寻找的问题, “我如何处理有可见度的项目:隐藏的?” 。 无论是: 可见的还是: 隐藏的, 都无法处理, 因为两者都在寻找文档中的显示。 据我所知, 没有选择器可以处理 cs 可见度。 这就是我是如何解决这个问题的( 标准拼写选择器, 可能有更压缩的语法 ) :
$(".item").each(function() {
if ($(this).css("visibility") == "hidden") {
// handle non visible state
} else {
// handle visible state
}
});
使用类切换,而不是样式编辑.
使用指定用于“ 隐藏” 元素的类是容易的, 也是最有效的方法之一 。 套用“ 隐藏” 的显示样式“ 无” 将比直接编辑该样式更快 。 我在堆叠溢出问题中解释了其中的一些内容, 使两个元素可见/ 隐藏在同一 div 中 。
缩略式最佳做法和优化
Google前端工程师Nicholas zakas在Google科技演讲中,
加速您的 Javascript (Youtube) 速度
可以创建函数以检查可见度/显示属性,以测量元素是否显示在 ui 中。
function checkUIElementVisible(element) {
return ((element.css('display') !== 'none') && (element.css('visibility') !== 'hidden'));
}
工作小儿
您可以使用隐藏选择器:
// Matches all elements that are hidden
$('element:hidden')
可见选择器 :
// Matches all elements that are visible
$('element:visible')
