How to get the first child element with jquery find method

Two acquisition methods: 1. First use find() to obtain all child elements, and then use the ":first-child" selector to filter the result set and return the first child element. The syntax "$(parent element ).find(":first-child")"; 2. First use find() to obtain all child elements, then use eq() to filter the result set and return the first child element, the syntax is ""$(parent element). find("*").eq(0)".

The operating environment of this tutorial: windows7 system, jquery3.6.0 version, Dell G3 computer.

In jquery, the find() method can obtain all child elements.

find() method: obtain all (including subsets of subsets) subset elements under this element

• The find() method returns the descendant elements of the selected element. (Descendants are children, grandchildren, great-grandchildren, and so on.)

• DOM tree: The The method traverses downwards along the descendants of the DOM element until all paths of the last descendant ().

So how to use the find method to get the first child element, just The elements obtained by the find method need to be filtered and the first element can be returned.

Two methods for jquery to use find() to obtain the first child element

Method 1: find() cooperates with:first-childselector to use

• find() to obtain the specified All child elements under the parent node

• Use: first-child to select the first element in the child element collection, that is, the first child element

Example:

      
  
 
香蕉
 
苹果
 
梨子
 
橘子
 
 父元素ul的第一个子元素  

Method 2: Use find() with the eq() method

• find() gets all the child elements under the specified parent node

• Use eq(0) to select the first element in the child element set, that is, the first child element

Based on the above example, modify:

$(function() { $("button").click(function() { $("ul").find("*").eq(0).css("color", "green"); }) })

##Instructions:

find() methodReturns the descendant elements of the selected element.

$(selector).find(filter)

Parameters Description Required. Filters the selector expression, element, or jQuery object that searches for descendant criteria.

filter	Note:To return multiple descendants, use commas to separate each expression.

:first-childThe selector selects the first child element that belongs to its parent element.

$(":first-child")

eq() methodReturns the element with the specified index number of the selected element.

Index numbers start with 0, so the index number of the first element is 0 (not 1).

$(selector).eq(index)

Parameters Description Required . Specifies the index of the element. Can be an integer or negative number.

index	Note:Using negative numbers will calculate the index from the end of the selected element.

[Recommended learning:

jQuery video tutorial,web front-end video】

The above is the detailed content of How to get the first child element with jquery find method. For more information, please follow other related articles on the PHP Chinese website!