Maison > interface Web > js tutoriel > le corps du texte

Comment fonctionne la méthode prev() de jQuery ?

王林
Libérer: 2024-02-27 13:36:04
original
493 Les gens l'ont consulté

Comment fonctionne la méthode prev() de jQuery ?

La méthode prev() de jQuery est une méthode utilisée pour obtenir les éléments frères immédiatement avant chaque élément de l'ensemble d'éléments correspondant. Cette méthode renvoie uniquement l’élément frère précédent immédiat, c’est-à-dire l’élément frère précédent. Ci-dessous, nous utilisons des exemples de code spécifiques pour illustrer le fonctionnement de la méthode prev() de jQuery.

Tout d'abord, nous préparons une structure HTML simple contenant trois éléments div adjacents :

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery的prev()方法示例</title>
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
</head>
<body>
<div id="div1">第一个div</div>
<div id="div2">第二个div</div>
<div id="div3">第三个div</div>

<script>
$(document).ready(function(){
  var prevElement = $('#div2').prev();
  console.log(prevElement.text());
});
</script>
</body>
</html>
Copier après la connexion

Dans le code ci-dessus, nous utilisons la bibliothèque jQuery et exécutons une fonction après le chargement du document. Dans cette fonction, nous sélectionnons l'élément div avec l'identifiant div2 et utilisons la méthode prev() pour obtenir l'élément frère précédent. Enfin, imprimez le contenu texte de l'élément obtenu sur la console.

Lorsque nous exécutons le code ci-dessus, "le premier div" sera affiché dans la console. En effet, la méthode prev() obtient l'élément frère devant div2, c'est-à-dire div1. prev() et imprime son contenu textuel.

Pour résumer, la méthode prev() de jQuery peut facilement obtenir les éléments frères avant un élément, rendant le positionnement et le fonctionnement des éléments pendant le processus de développement front-end plus flexibles et plus pratiques.

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!

source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal