jqueryで兄弟要素を見つける方法は何ですか?-フロントエンドQ&A-php.cn

jqueryで兄弟要素を見つける方法は何ですか?

青灯夜游

リリース： 2022-05-25 17:50:38

オリジナル

4716 人が閲覧しました

メソッドは、 1. 同世代の要素をすべて取得できる Brothers() 、 2. 次の兄弟要素を取得できる next() 、 3. nextAll() の 7 つです。次の兄弟のすべての要素; 4. prev()、上位レベルの兄弟要素を取得できます; 5. prevAll()、すべての上位レベルの兄弟要素を取得できます。

jqueryで兄弟要素を見つける方法は何ですか?

このチュートリアルの動作環境: Windows7 システム、jquery1.10.2 バージョン、Dell G3 コンピューター。

jquery が兄弟要素を検索するには、次の 7 つのメソッドがあります。sisters()、next()、nextAll()、nextUntil()、prev()、prevAll()、prevUntil()

1. Siblings() メソッド

は主に、指定された要素のピアのすべての要素を取得するために使用されます

<!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"
				});
			});
		</script>
	</head>
	<body>

		<div style="width:500px;" class="siblings">
			<ul>ul 
				<li>li (同辈节点)</li>
				<li>li (上一个同辈节点)</li>
				<li class="start">li (本元素)</li>
				<li>li (下一个同辈节点)</li>
				<li>li (同辈节点)</li>
			</ul>
		</div>

	</body>
</html>

ログイン後にコピー

jqueryで兄弟要素を見つける方法は何ですか?

2 . next( ) メソッド

# は主に、指定された要素

$(document).ready(function() {
	$("li.start").next().css({
		"color": "red",
		"border": "2px solid red"
	});
});

ログイン後にコピー

jqueryで兄弟要素を見つける方法は何ですか?

3 の次の兄弟要素を取得するために使用されます。 ) メソッド

主に、指定された要素の次の兄弟のすべての要素を取得するために使用されます

$(document).ready(function() {
	$("li.start").nextAll().css({
		"color": "red",
		"border": "2px solid red"
	});
});

ログイン後にコピー

jqueryで兄弟要素を見つける方法は何ですか?

#4. nextUntil() メソッド

主に、指定された要素の次の兄弟要素を取得するために使用されます。この兄弟要素は、指定された要素と nextUntil() メソッドで設定された要素の間の要素である必要があります。 ##5. prev() メソッド

主に、指定された要素の上位レベルの兄弟要素を取得するために使用されます

$(document).ready(function() {
	$("li.start").prev().css({
		"color": "red",
		"border": "2px solid red"
	});
});

ログイン後にコピー

##6 , prevAll() メソッド jqueryで兄弟要素を見つける方法は何ですか?

主に、指定された要素の上位レベルにあるすべての兄弟要素を取得するために使用されます#

$(document).ready(function() {
	$("li.start").prevAll().css({
		"color": "red",
		"border": "2px solid red"
	});
});

ログイン後にコピー

##7。 () method
主に、指定された要素の前の兄弟要素を取得するために使用されます。この兄弟要素は、指定された要素と prevUntil() メソッドで設定された要素の間の要素である必要があります
[推奨学習: jQuery ビデオチュートリアル
、
Web フロントエンドビデオ
]
以上がjqueryで兄弟要素を見つける方法は何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。