JQuery hierarchical selector Usage Analysis _ jquery

This article mainly introduces the usage of jQuery hierarchical selector. It analyzes the common usage skills of four hierarchical selector types and provides examples. For more information, see the HTML document, each element is always in a certain position on the DOM node tree, and there is always a hierarchical relationship between elements in the document hierarchy, such as the relationship between parent and child levels.

1. Child element Selector

Used to find all child elements under a given parent element. Syntax format:

The Code is as follows:

$ ("Parent-> chilid ");

2. Descendant element Selector

It is used to match all descendant elements under a given ancestor element. Syntax format:

The Code is as follows:

$ ("Ancestor descendant ");

3. Peer element Selector

It is used to match all next elements next to the prev element. Syntax format:

The Code is as follows:

$ ("Prev + next ")

4. Adjacent peer element Selector

Select all peer elements after an element. The syntax format is as follows:

The Code is as follows:

$ ("Prev ~ Siblings ")

Comprehensive instance:

The Code is as follows: