Comment effacer les éléments frères et sœurs dans jquery-Questions et réponses frontales-php.cn

Comment effacer les éléments frères et sœurs dans jquery

青灯夜游

Libérer： 2022-03-10 18:48:50

original

2879 Les gens l'ont consulté

Comment effacer les éléments frères et sœurs dans jquery : 1. Utilisez siblings(), next(), prev() et d'autres méthodes pour obtenir des éléments frères et sœurs ; 2. Utilisez la méthode remove() pour supprimer les éléments frères obtenus, la syntaxe est la suivante : " Élément frère.remove()".

Comment effacer les éléments frères et sœurs dans jquery

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

jquery efface les éléments frères et sœurs

Méthode d'implémentation :

Obtenez d'abord les éléments frères et sœurs, il existe généralement sept méthodes : siblings(), next(), nextAll(), nextUntil(), prev( ), méthode prevAll(), prevUntil()
- siblings(), principalement utilisée pour obtenir tous les éléments du même niveau de l'élément spécifié
- next(), méthode principalement utilisée pour obtenir le prochain frère du Élément de niveau d'élément spécifié Méthode
- nextAll(), principalement utilisée pour obtenir tous les éléments du niveau frère suivant de l'élément spécifié Méthode
- nextUntil(), principalement utilisée pour obtenir l'élément frère suivant de l'élément spécifié, ce frère L'élément doit être un élément entre l'élément spécifié et l'élément défini par la méthode nextUntil()
- prev() méthode, principalement utilisée pour obtenir les éléments frères de niveau supérieur de l'élément spécifié
- prevAll( ), principalement utilisée La méthode
- prevUntil() est principalement utilisée pour obtenir tous les éléments frères au niveau précédent de l'élément spécifié. Cet élément frère doit être l'élément défini par l'élément spécifié et la méthode prevUntil(). . Les éléments entre
puis utilisez la méthode Remove() pour supprimer les éléments frères et sœurs obtenus

Exemple : Supprimer tous les éléments du même niveau

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

		<div style="width:500px;" class="siblings">
			<ul>ul (父节点)
				<li>li (类名为"star"的上一个兄弟节点)</li>
				<li>li (类名为"star"的上一个兄弟节点)</li>
				<li class="start">类名称为“star”的li元素</li>
				<li>li (类名为"star"的下一个兄弟节点)</li>
				<li>li (类名为"star"的下一个兄弟节点)</li>
			</ul>
		</div>
		<p>选择类名称为“star”的li元素的所有兄弟元素</p>
		<button>删除所有兄弟元素</button>
	</body>
</html>

Copier après la connexion

Comment effacer les éléments frères et sœurs dans jquery