JQuery learning notes change jQuery objects

The task of jQuery code is to generate jQuery object A, operate jQuery object A, generate jQuery object B, and operate jQuery object B ...... However, if the objects A, B ...... There is a relationship between them, so there is no need to go to $ (selector) one by one, which is very tedious. Therefore, jQuery provides some methods to convert the process to generate jQuery object A, operate jQuery object A, change jQuery object B, and operate jQuery object B ......

A jQuery object requires N operations and M changes. Therefore, it is necessary to store the generated jQuery object in a variable and call it multiple times. However, it is cumbersome to declare a new variable every time you perform an operation or change. Therefore, jQuery adopts the chained operation method, that is, the operation object itself is returned after the operation is executed, so the next operation can be continued until the change is executed when the object needs to be changed, and then the modified object is returned. This is actually a functional thinking.

For example, compare the following items:

General call	Chain call
A = $ ("div "); A. addClass ("class "); B = a. children ("ul "); B. show (); C = a. siblings (); C. removeClass ("class ");	$ ("Div"). addClass ("class ") . Children ("ul"). show (). end () . Siblings (). removeClass ("class ");

Next we will introduce the methods for changing jQuery objects:

Change to descendant Element Set

Method	Description	Equivalent
Children (selector)	In the descendant element of the original element, select the element that matches the selector. If no parameter is set, children () is equivalent to children (*). All child elements of the original element are selected.	$ (Selector1). children (selector2) seconds $ (selector1> selector2)
Find (selector)	In the descendant element of the original element, select the element that matches the selector. If no parameter is set, find () is equivalent to find (": not (*)"), and no descendant element of the original element is selected.	$ (Selector1). find (selector2) ≈ $(selector1 selector2 ). If the basic filter selector is used for a parameter, filter matching elements are not selected for all descendant elements. Instead, filter matching elements are selected for each descendant element.
Contents ()	Select the child element or text block of the original element

 

Changed to an ancestor Element Set

Method	Description
Parent (selector)	In the parent element of the original element, select the element that matches the selector. If no parameter is set, parent () is equivalent to parent ("*"). Select All parent elements of the original element.
Parents (selector)	Select the element that matches the selector from the ancestor element of the original element. If no parameter is set, parents () is equivalent to parents ("*"). Select all the ancestor elements of the original element.
ParentsUntil (selector)	Select the ancestor element of the original element until it matches the selector element and does not include it. If no parameter is set, parentsUntil () is equivalent to parents (). Select all the ancestor elements of the original element.
OffsetParents ()	Select the last ancestor positioning element of the original element, and the element CSS attribute display cannot be none. The position element refers to the position of the CSS attribute.
Closest (selector)	In the original Element and Its ancestor element, select the closest element matching the selector.

 

Change to sibling Element Set

Method	Description	Equivalent
Next (selector)	In the first sibling element after the original element, select the element that matches the selector. If no parameter is set, next () is equivalent to next ("*"). Select the first sibling element after the original element.	$ (Selector1). next (selector2) seconds $(selector1 + selector2)
Prev (selector)	In the first sibling element before the original element, select the element that matches the selector. If no parameter is set, prev () is equivalent to prev ("*"). Select the first sibling element before the original element.
NextAll (selector)	Select an element that matches the selector from the sibling element behind the original element. If no parameter is set, nextAll () is equivalent to nextAll ("*"). All the sibling elements following the original element are selected.	$ (Selector1). nextAll (selector2) seconds $(selector1 ~ Selector2)
PrevAll (selector)	Select the element matching the selector from the sibling element before the original element. If no parameter is set, prevAll () is equivalent to prevAll ("*"). All the sibling elements before the original element are selected.
Siblings (selector)	In the original sibling element, select the element that matches the selector. If no parameter is set, siblings () is equivalent to siblings ("*"), and all sibling elements of the original element are selected.
NextUntil (selector)	Select the sibling element after the original element until it matches the selector element and does not include it. If no parameter is set, nextUntil () is equivalent to nextAll (). All the sibling elements following the original element are selected.
PrevUntil (selector)	Select the sibling element before the original element until it matches the selector element and does not include it. If no parameter is set, prevUntil () is equivalent to prevAll (). All the sibling elements before the original element are selected.

 

Change to more element sets

Method	Description	Equivalent
Add (selector)	Add the element matching the selector on the basis of the original element	$ (Selector1). add (selector2) rows $ (selector1, selector2)
AndSelf ()	If you change to a descendant element, an ancestor element, or a sibling element, an element is selected outside the original element. It can be used to merge the original element and the selected element of the change operation.

 

Change to Partial Element Set

Method	Description	Equivalent
Eq (index)	Filter the elements whose index value is equal to index in the original element. The index value starts from 0 and is positive. It can also start from-1, but cannot be mixed.	$ (Selector). eq (index) operator $ (selector: eq (index ))
First ()	Filtering the first element in the original element is equivalent to eq (0)	$ (Selector). first () operator $ (selector: first)
Last ()	Filtering the last element in the original element is equivalent to eq (-1)	$ (Selector). last () seconds $ (selector: last)
Slice (start, [end])	Filter the elements whose index values are from start to end-1 in the original element. If end is not input, filter the elements whose index value is greater than or equal to start.
Filter (selector)	Filter the elements matching selector in the original element
Filter (fn (index ))	Filter by function. If the function returns true for an element whose index value is equal to index, the element is included in the filter set; otherwise, the element is excluded.	$ (Selector: even (index), $ (selector: odd (index )), $ (Selector: gt (index )), $ (Selector: lt (index) and so on
Not (selector)	Filter elements that do not match selector in the original element	$ (Selector1). not (selector2) seconds $ (selector1: not (selector2 ))
Not (fn (index ))	Filter by function. If the function returns true for an element whose index value is equal to index, this element is excluded from the filter set; otherwise, it is included.	$ (Selector: even (index), $ (selector: odd (index )), $ (Selector: gt (index )), $ (Selector: lt (index) and so on
Has (selector)	Filter out the elements that match the selector descendant element from the original element.	$ (Selector1). has (selector2) seconds $ (selector1: has (selector2 ))

 

Restore jQueryObject

Method	Description
End ()	Restores the selected element after the jQuery object change operation to the previous one. If you want to restore multiple changes, call the API multiple times until the empty set is returned.