• 欢迎来到本站,本站主要做程序员相关技术、博客、笔记,如果喜欢本网站那么赶紧使用Ctrl+D 收藏吧!
  • 如果有任何疑问,可以在下方文章下方留下你的评论~

JavaScript or jQuery hides an element and How to check hidden elements?

电子书籍 8个月前 (10-08) 2次浏览 0个评论
<div id="demo">AAA</div>

JavaScript hides an element

Method 1

release the occupied page space after hiding:

document.getElementById ("demo"). style.display= "none"; // hide
document.getElementById ("demo"). style.display= ""; // display

Method 2

after hiding, it still occupies page space and displays blank.

div visibility can control the display and hiding of div, but the page will be blank after hiding:

document.getElementById ("demo"). style.visibility= "hidden"; // hidden

document.getElementById ("demo"). style.visibility= "visible"; // display

jQuery hides an element

// attribute
$("#demo").attr("style","display:none;");//hidden
$("#demo").attr("style","display:block;");//display

// css
$("#demo").css("display","none");//hidden
$("#demo").css("display","block");//display

// hide() and show()
$("#demo").hide();//hidden
$("#demo").show();//display

// toggle <div id="demo"></div>
$("#demo").toggle(
    function () {
        $(this).attr("style","display:none;");//hidden
    },

    function () {
         $(this).attr("style","display:block;");//display
     }
);

Note:

$("#demo").show()//display:block
$("#demo").hide()//display:none

For more information, please click here

How to check hidden elements?

You can use jQuery’s is() function to check whether an element is hidden:

// Checks CSS content for display:[none|block], ignores visibility:[true|false]
$(element).is(":visible");

// The same works with hidden
$(element).is(":hidden");

中国笔友, 版权所有丨如未注明 , 均为原创丨本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:JavaScript or jQuery hides an element and How to check hidden elements?
喜欢 (0)
发表我的评论
取消评论
表情 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址