Maison > Article > interface Web > Comment interroger le dernier élément enfant avec jquery

Comment interroger le dernier élément enfant avec jquery

青灯夜游original: 2022-05-13 18:29:149303parcourir

Deux méthodes : 1. Utilisez le sélecteur children() et ":last-child", la syntaxe "$(parent element).children(":last-child")". 2. Utilisez children() et eq(), la syntaxe est "$(parent element).children().eq(-1)".

L'environnement d'exploitation de ce tutoriel : système Windows 7, jquery version 1.10.2, ordinateur Dell G3.

Deux façons d'interroger le dernier élément enfant avec jquery

Méthode 1 : utilisez le children()和:last-childsélecteur

Utilisez children() pour obtenir tous les éléments enfants directs sous le nœud parent spécifié
Utilisation :last-child sélectionne le dernier élément de la collection d'éléments enfants, c'est-à-dire le dernier élément enfant

Exemple :

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-1.10.2.min.js"></script>
		<script>
			$(function () {
            $("button").click(function () {
				$("ul").children(":last-child").css("color","red");
            })
        })
    </script>
	</head>
	<body>
		<ul>
			<li>香蕉</li>
			<li>苹果</li>
			<li>梨子</li>
			<li>橘子</li>
		</ul>
		<button>父元素ul的最后一个子元素</button>
	</body>
</html>

Comment interroger le dernier élément enfant avec jquery

Méthode 2 : Utiliser children() et eq()

Utilisez children( ) Obtenez tous les éléments enfants directs sous le nœud parent spécifié
Utilisez eq(-1) pour sélectionner le dernier élément de l'ensemble d'éléments enfants, c'est-à-dire le dernier élément enfant

Basé sur exemple ci-dessus, modifiez :

$(function() {
	$("button").click(function() {
		$("ul").children().eq(-1).css("color", "red");
	})
})

Comment interroger le dernier élément enfant avec jquery

【Apprentissage recommandé : Tutoriel vidéo jQuery, vidéo web front-end】

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

jquery 选择器

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Comment utiliser jquery pour modifier le texte en cliquantArticle suivant：Comment utiliser jquery pour modifier le texte en cliquant

Articles Liés

Voir plus