Examples of jQuery chain usage in jQuery applications_jquery

The example in this article describes the usage of jQuery chain in jQuery application. Share it with everyone for your reference. The specific analysis is as follows:

Many times we can link jQuery statements together, which not only shortens the code length, but also often achieves special effects. First look at the following code:

Copy code The code is as follows:

The above code adds style css1 to the entire

list, then filters it, and then adds css2 style individually to the filtered elements. Without jQuery, it would be very troublesome to achieve the above effects.

In the jQuery chain, subsequent operations take the result of the previous operation as the object. If you want the operation object to be the object of the previous step, you can use the end() method.

Use the end() method to control the jQuery chain.

Copy code The code is as follows:

Hello,howare you?

very nice,Thank you.

The above code searches for the tag in

, then adds style css1, uses the end() method to set the operation object back to $("p") and adds style style css2.

In addition, you can also combine the previous two objects through andSelf() and process them together.

Use the andSelf() method to control the jQuery chain.

Copy code The code is as follows:

First paragraph

Second paragraph

The above jQuery code first searches for the

tag in

, adds css1. This style is only valid for the

tag, and then uses the andSelf() method to separate

and

Combine them together, and then add style css2. This style is valid for both

and

.

Effect:

Copy code The code is as follows:

First paragraph

Second paragraph

I hope this article will be helpful to everyone’s jQuery programming.

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

Previous article：2 tips for jQuery study notes_jqueryNext article：2 tips for jQuery study notes_jquery

Related articles

See more

• An in-depth analysis of the Bootstrap list group component
• Detailed explanation of JavaScript function currying
• Complete example of JS password generation and strength detection (with demo source code download)
• Angularjs integrates WeChat UI (weui)
• How to quickly switch between Traditional Chinese and Simplified Chinese with JavaScript and the trick for websites to support switching between Simplified and Traditional Chinese_javascript skills

Public welfare online PHP training，Help PHP learners grow quickly！

About usDisclaimerSitemap

© php.cn All rights reserved