Comment supprimer l'élément précédent dans jquery-Questions et réponses frontales-php.cn

Maison

interface Web

Questions et réponses frontales

Comment supprimer l'élément précédent dans jquery

May 17, 2022 pm 07:22 PM

jquery

Comment supprimer l'élément précédent : 1. Utilisez prev() pour sélectionner l'élément précédent de l'élément spécifié. La syntaxe "$(specified element).prev()" renverra un objet jquery contenant l'élément précédent ; Utilisez Remove() pour supprimer l'objet jquery, la syntaxe est "jquery object.remove()".

Comment supprimer l'élément précédent dans jquery

L'environnement d'exploitation de ce tutoriel : système windows7, version jquery3.2.1, ordinateur Dell G3.

Méthode jquery pour supprimer l'élément précédent

1. Utilisez la méthode prev() pour sélectionner l'élément précédent de l'élément spécifié

prev() peut obtenir l'élément frère de niveau supérieur de l'élément spécifié. élément.

Syntaxe :

$(selector).prev(filter)

Copier après la connexion

Paramètres	Description
filter	Facultatif. Spécifie une expression de sélection qui restreint la recherche de l'élément frère précédent.

Exemple : Sélectionnez l'élément précédent de l'élément li avec le nom de classe "start"

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-3.2.1.min.js"></script>
		<style>
			.siblings * {
				display: block;
				border: 2px solid lightgrey;
				color: lightgrey;
				padding: 5px;
				margin: 15px;
			}
			.start{
				color: peru;
			}
		</style>
		<script>
			$(document).ready(function() {
				$("li.start").prev().css({
					"color": "red",
					"border": "2px solid red"
				});
			});
		</script>
	</head>
	<body>

		<div style="width:500px;" class="siblings">
			<ul>ul (父节点)
				<li>li (兄弟节点)</li>
				<li>li (类名为"start"的li节点的上一个兄弟节点)</li>
				<li class="start">li (类名为"start"的li节点)</li>
				<li>li (兄弟节点)</li>
				<li>li (兄弟节点)</li>
			</ul>
		</div>
		<p>选取类名为"start"的li元素的前一个元素</p>
	</body>
</html>

Copier après la connexion

Comment supprimer lélément précédent dans jquery

2. Utilisez Remove() pour supprimer l'élément sélectionné

remove() pour supprimer. l'élément élément sélectionné, y compris tous les textes et nœuds enfants. Syntaxe :

被选元素.remove()

Copier après la connexion

Exemple : sur la base de l'exemple ci-dessus, supprimez l'élément précédent de l'élément li avec le nom de classe "start"

<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<script src="js/jquery-3.2.1.min.js"></script>
		<style>
			.siblings * {
				display: block;
				border: 2px solid lightgrey;
				color: lightgrey;
				padding: 5px;
				margin: 15px;
			}
			.start{
				color: peru;
			}
		</style>
		<script>
			$(document).ready(function() {
				$("li.start").prev().css({
					"color": "red",
					"border": "2px solid red"
				});
				$("button").click(function() {
					$("li.start").prev().remove();
				});
			});
		</script>
	</head>
	<body>

		<div style="width:500px;" class="siblings">
			<ul>ul (父节点)
				<li>li (兄弟节点)</li>
				<li>li (类名为"start"的li节点的上一个兄弟节点)</li>
				<li class="start">li (类名为"start"的li节点)</li>
				<li>li (兄弟节点)</li>
				<li>li (兄弟节点)</li>
			</ul>
		</div>
		<button>删除类名为"start"的li元素的前一个元素</button>
	</body>
</html>

Copier après la connexion

Comment supprimer lélément précédent dans 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!

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