JQuery, selectors/filters/performance optimization

1. Browser introduction:

1. The jquery object is an array-like object. The array-like object has length and can be passed Index access, if the array-like object is not added manually, the methods of the array object are not available.

2. The length of an array will automatically grow when adding elements, but a class array will not.

3. Class arrays can be converted into arrays through the slice method:

##

Array.prototype.slice.call(a);

1. JQuery basic selector:

1. ID selector

2. Class selector

3. Descendant selector

4. Attribute selector

5. a[href!="http://www.baidu.com"], a new method in jquery, selects all elements that are not equal to Baidu URL.

1. JQuery Filter/Filter:

• lang(language) ：Select elements in the specified language

• not(selector) ：Select all elements that are not the specified elements

• root                                                                                                                                                                                                                                                  Contains OPACITY, does not include HIDDEN elements, excluding elements that are not displayed in the position

• Visible: Just opposite to Hidden

## Header ：Select the title element
animated ：Select all elements that are performing animation effects
• ##：empty ：Select the content Empty elements

• : contains(text) : Select elements to filter text

: has(selector) : For example, select p:has (span)

• ：parent ：Select the parent element
• :first-child

• :last-child

##first-of-type : Select the first one with the same type: li:first-of-type

• last-of-type

• nth-child() : Counting from 1

• nth-last-child()

• nth-of-type()

• ##nth-last-of-type()

• only-child

• only-of-type

• ##:checked : Select the selected

• :disabled : Select and disable

• :enabled : All except disabled ones can be selected

: focus : generally not used directly, wait until the form is loaded before using
: button : not only selects the button, but also selects the type of button
:checkbox ：Select all multi-select boxes
:file ：Select the file input box
:image ：Select the type of image Element
:input : Select all form elements
:password
:radio : Select the radio button
:reset ：The selected type is reset,
:selected ：Select all selected states
:submit : The selected type is submit, and some browsers will also select button
:text : The selected type is text, and ## with no type set will also be selected.
• #:first

• :last

• :even

:odd

• :eq(n) : equal to n

• ##:gt(n) : greater than n

• :lt(n) : less than n

Position filter:
Form Filter
Child Element Filter
Content Filter

1. ## Other filters

2. Custom selector

1. Performance optimization of JQuery selector:

1. Try to use selectors available in CSS

2. Avoid over-constraints

3. Try to start with ID

4. Let the selector have more features on the right side

5. Avoid using global selectors

6. Cache selector results

The above is the detailed content of JQuery, selectors/filters/performance optimization. For more information, please follow other related articles on the PHP Chinese website!