jquery Selector--Visibility Filter Selector

jquery Visibility Filter selector

1 Visibility Filter Selector

$ (": Visible") Select all displayed elements

$ (": Hidden") Select all hidden elements, including display= "none" element styles and hidden forms, visibility, etc.

2 Ways to hide elements

the value of CSS display is none

type= form elements for "hidden"

Width and height are displayed set to 0

The ancestor element is hidden, and the element is not displayed on the page

The value of CSS visibility is hidden

The value of CSS opacity is 0

3 elements occupy a certain space in the document is visible, so the width and height of the element is greater than 0

4 Elements of the Visibility:hidden or opacity:0 are visible and still occupy the spatial layout

5 An element that is not in the document is not visible, and jquery in the inserted document has no way to know if it is viewable because the element visibility depends on the style used

The 6 property selector can position an element based on an attribute, specify an attribute of the element, all use the property regardless of its value, and the element will be positioned to be more explicit and locate elements that use a specific value on those properties

7 Property Selector

$ ("[attribute|= ' value ']") Select the specified attribute value equals the given string or is prefixed with the literal string

(The string followed by a hyphen "-") of the element

$ ("[attribute*= ' value ']") Select the specified property has an element that contains a given substring (select the element with the given attribute to contain some value)

$ ("[attribute~= ' value ']") Select an element with a space-delimited value for the specified property that contains a given value

$ ("[attribute= ' value ']") Select the element that specifies that the property is a given value

$ ("[attribute!= ' value ']") Select the element that does not exist for the specified property, or the specified property value is not equal to the given value

$ ("[attribute^= ' value ']") Select the element that the specified property is starting with the given string

$ ("[attribute$= ' value ']") Select the element that specifies that the property is the end of the given value, and the comparison is case-sensitive

$ ("[attribute]") selects all elements with the specified attribute, which can be any value

$ ("[Attribute1][attributefiltern]") Select the element that matches all the specified property filters

8 Browser support

[Att=val], [ATT], [att|=val], [att~=val] belong to the CSS2.1 specification

[Ns|attr], [Att^=val], [Att*=val], [att$=val] belong to the CSS3 specification

[name!= "Value"] is a selector for the jquery extension

9 [attr= "value"] and [attr*= "value"] are the most practical

[attr= "value"] can locate different types of elements, especially the form form elements, such as input[type= "text" and input[type= "checkbox", etc.

One [attr*= "value"] can match different types of files in the website

jquery Selector--Visibility Filter Selector