Home  >  Article  >  Web Front-end  >  How to use $(this) in jquery to select the child elements below it

How to use $(this) in jquery to select the child elements below it

coldplay.xixi
coldplay.xixiOriginal
2020-11-18 10:40:094958browse

The method for jquery to use $(this) to select the sub-elements below it: first use the span tag within the p tag to create multi-line text; then use the bind method to bind the click event to the p tag through [$ (this)] obtains the currently clicked object; finally obtains all child elements through [html()].

How to use $(this) in jquery to select the child elements below it

The operating environment of this tutorial: windows10 system, jquery2.2.4, this article is applicable to all brands of computers.

Recommended: "jquery video tutorial"

Jquery uses $(this) to select the child elements below it:

1. Create a new html file, named test.html, to explain how jquery uses $(this) to select other sub-elements below.

How to use $(this) in jquery to select the child elements below it

2. In the test.html file, introduce the jquery.min.js library file and successfully load the file before you can use the methods in jquery.

How to use $(this) in jquery to select the child elements below it

3. In the test.html file, within the p tag, use the span tag to create multi-line text. The span tag is used as a sub-element of the p tag, and the p tag is set at the same time. The id is mytest.

How to use $(this) in jquery to select the child elements below it

##4. In the test.html file, write the

<script></script> tag. The js logic code of the page will be written in within this tag.

How to use $(this) in jquery to select the child elements below it

5. In the js tag, obtain the p tag object through id (mytest), and use the

bind() method to bind the click event to it , the code is as follows:

How to use $(this) in jquery to select the child elements below it

6. In the bind() method, get the currently clicked object through

$(this), and through html ()Get all the child elements in it and save it in the html variable. Finally, use the alert() method to output the child elements.

How to use $(this) in jquery to select the child elements below it

7. Open the test.html file in the browser, click on the text to see the effect.

How to use $(this) in jquery to select the child elements below it

Related free learning recommendations:

JavaScript (video)

The above is the detailed content of How to use $(this) in jquery to select the child elements below it. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn