Home > Web Front-end > JS Tutorial > How to select the child element under a node using jquery

How to select the child element under a node using jquery

藏色散人
Release: 2020-12-18 10:33:29
Original
3272 people have browsed it

How to use jquery to select the sub-element under the node: first open the corresponding code file; then use the ":eq()" selector in jquery to select the specified sub-element under the node. The syntax is "$("p:eq(1)").css("background-color"...)".

How to select the child element under a node using jquery

The operating environment of this tutorial: windows7 system, jquery1.12.0 version. This method is suitable for all brands of computers.

Recommended: "jquery Video Tutorial"

In jquery, you can use the :eq() selector to select the specified sub-element under the node, :eq() The selector selects elements with a specified index value. Index values ​​start at 0, and all first elements have an index value of 0 (not 1).

This method is often used with other elements/selectors to select elements with a specific sequence number in a specified group.

Example:

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript"> 
 
$(document).ready(function(){
    $("p:eq(1)").css("background-color","#B2E0FF");
});
 
</script>
 
</head>
<body>
<html>
<body>
<h1>Welcome to My Homepage</h1>
<p class="intro">My name is Donald</p>
<p>I live in Duckburg</p>
<p>My best friend is Mickey</p>
<div id="choose">
Who is your favourite:
<ul>
<li>Goofy</li>
<li>Mickey</li>
<li>Pluto</li>
</ul>
</div>
</body>
</html>
 
 
</body>
</html>
Copy after login

The above is the detailed content of How to select the child element under a node using jquery. 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