Comment trouver le nombre d'éléments frères et sœurs dans jquery-Questions et réponses frontales-php.cn

Comment trouver le nombre d'éléments frères et sœurs dans jquery

青灯夜游

Libérer： 2022-05-16 16:17:57

original

2265 Les gens l'ont consulté

Méthode d'obtention : 1. Utilisez siblings() pour obtenir les éléments frères de l'élément spécifié. La syntaxe "specified element.siblings()" renverra un objet jQuery contenant tous les éléments frères et sœurs ; renvoyez-le à l'objet jQuery. Le nombre d'éléments, la syntaxe est "spécifier objet.longueur".

Comment trouver le nombre d'éléments frères et sœurs dans jquery

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

Méthode Jquery pour trouver le nombre d'éléments frères et sœurs

1 Utilisez la méthode siblings() pour obtenir tous les éléments frères de l'élément sélectionné

Cette méthode avance et avance le long des éléments frères de l'élément frère. Élément DOM Traverse plus tard.

指定元素.siblings()

Copier après la connexion

renverra un objet jQuery contenant tous les éléments frères.

2. Utilisez l'attribut length pour obtenir le nombre

L'attribut length comptera le nombre d'éléments dans l'objet jQuery et le renverra.

指定对象.length

Copier après la connexion

Exemple d'implémentation :

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<style>
			.siblings,.siblings *{ 
				display: block;
				border: 2px solid lightgrey;
				color: lightgrey;
				padding: 5px;
				margin: 15px;
			}
		</style>
		<script src="js/jquery-1.10.2.min.js"></script>
		<script type="text/javascript">
			$(document).ready(function() {
				$("button").click(function() {
					$("h2").siblings().css("border","2px solid red")
					var len=$("h2").siblings().length;
					console.log("兄弟元素的个数为："+len); 
				});
			});
		</script>
	</head>
	<body>
		<div class="siblings">div (父)
			<p>p（兄弟元素）</p>
			<span>span（兄弟元素）</span>
			<h2>h2（本元素）</h2>
			<h3>h3（兄弟元素）</h3>
			<p>p（兄弟元素）</p>
		</div>
		<button>获取兄弟元素的个数</button>
	</body>
</html>

Copier après la connexion

Comment trouver le nombre déléments frères et sœurs dans jquery