Home > Database > Mysql Tutorial > jQuery method to operate the Nth element

jQuery method to operate the Nth element

小云云
Release: 2017-11-21 14:11:35
Original
2013 people have browsed it

jQuery is a cross-browser JavaScript library that simplifies operations between HTML and JavaScript. The first version was released by John Resig at BarCamp NYC in January 2006. It is currently being developed by a development team led by Dave Methvin. Among the top 10,000 most visited websites in the world, 59% use jQuery, which is currently the most popular JavaScript library. In this article, we will explain a little trick to you, how jQuery operates the Nth element of the same group of elements.

For example:

There are 3 uls under class="phpernote". Now I want to add class="com" to the fifth li element under each ul

Specific jQuery code:

 $(".phpernote ul li:nth-child(5)").addClass("com");
Copy after login

We have successfully added class to the fifth li under each ul as com

Of course, you can also add CSS code directly:

$(".phpernote ul li:nth-child(5)").css({"padding-right":"5px"});
Copy after login

nth-child: The abbreviation in English, n-th, indicates which number, 1, 2, and 3 are represented by the words first, second, and third respectively. The words starting from 4 are numbers + th, such as 4th, 5th, 6th Wait

Get the first li under ul

$("ul li:first-child")
Copy after login

Get the last li under ul

$("ul li:last-child")
Copy after login

The above is how jquery operates the Nth element of the same group of elements The method is explained, I hope it will be helpful to everyone.

Related recommendations:

Summary of jquery operation ul skills

Detailed explanation of the three methods of jQuery operating element css style

Advanced web jQuery operation DOM elements&&MySQL record operation&&PHP object-oriented learning notes

The above is the detailed content of jQuery method to operate the Nth element. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template