How to get hidden tags in jquery

When using jQuery for DOM operations, sometimes you need to operate on DOM elements with hidden styles. In this case, you need to obtain the hidden tags. So how does jQuery get hidden tags?

The first thing you need to understand is that jQuery provides two ways to obtain hidden tags, namely .hidden and .not(:visible). Next, we will introduce these two methods in detail.

1. .hidden

In jQuery, .hidden is a special selector that can select anything with display: none; style element. The following is how to use .hidden:

$(".hidden")       // 选取具有 hidden 类的元素

For example, we can get the element with id as test through the following code:

这是一个隐藏元素

var element = $("#test.hidden");

The element variable in the above code will be the div element with id being test because it has hidden Class.

2. .not(:visible)

If the element's display value is none, Then .hidden is a good choice. However, if the element is hidden using visibility: hidden or opacity: 0, etc., then the .hidden selector cannot be used. At this time, we can use .not(:visible) to get the hidden tag.

.not(:visible) is the negated version of the :visible selector, which selects invisible elements, including using display:none ;, or set visibility to hidden elements. The following is how to use .not(:visible):

$(":not(:visible)")        // 选取具有不可见样式的元素

For example, we can use the following code to get the id for test Element:

这是一个不可见的元素

var element = $("#test").not(":visible");

The element variable in the above code will be the div element with id being test, because It's not visible.

Summary

Both of the above methods can be used to obtain hidden tags, but you need to choose the appropriate method based on how the element is hidden. .hidden can select elements equal to display: none;, while .not(:visible) can select all hidden elements, including using display :none;, or set visibility to hidden elements.

In short, getting hidden tags in jQuery is a very common operation. Mastering the above method can make us more comfortable in actual development.

The above is the detailed content of How to get hidden tags in jquery. For more information, please follow other related articles on the PHP Chinese website!