Select HTML traversal function using JQuery

　Using JQuery, you can easily select THML elements. But sometimes, when the HTML structure is more complex, refining the elements we choose is a troublesome thing.

1. children

　This function gets the direct children of a set of elements.

Pass a selection expression to children() to narrow the selection results to the selected elements;

　If children() accepts any parameters, all direct children will be returned; its grandchild elements will not be returned.

2.filter

　This function filters elements from a collection by passing a selection expression. Any elements that do not match this expression will be removed from the selected collection.

3, not

Exactly the opposite of filter, not() removes matching elements from the collection.

4、add

　What if we want to add some elements to the collection? The add() function does exactly this.

5、slice

　 Sometimes, we need to obtain a subset of a set based on the position of the element in the set. sliece() does exactly this.

　The first parameter is the position of the first element starting from zero, which is included in the returned fragment;

　The second parameter is the zero-based index of the first element. Not included in the returned fragment. If omitted, will extend to the end of the collection;

6、parent

　The parent() function selects the direct parent of a series of elements.

7、parents

　This is the plural form, parents() selects all ancestor elements of the collection. I mean all ancestor elements including direct parents to "body" and "html" elements. So it's better to narrow down the selection by passing an expression.

8、siblings

　This function selects all siblings of a set of elements. Passing an expression can filter the results.

9, prev & prevAll

　The prev() function selects the previous sibling node. prevAll() selects all sibling nodes in front of an element set.

10, next & nextAll

These functions work the same as prev and prevAll, except it selects the next sibling.