まだデータがありません。
子セレクター (“parent > child”)
当ページのリンクには広告が含まれています。
スポンサーリンク
jQueryの子セレクターの解説をします。
子セレクター (“parent > child”)は、親要素（parent）の直下の指定された子要素（child）を選択します。
サンプル／デモ
では、「:diabledセレクター」の動きを簡単なサンプルで確認してみましょう。セレクターとして、ID[#id-parent]直下のクラス[.class-child]を指定しているので、該当する要素にクラス.add-cssが追加されます。
<script>
$(document).ready(function () {
$("#id-parent > .class-child").addClass("add-css");
});
</script>
「子セレクター (“parent > child”)」のサンプル
ソース（ HTML + jQuery ）
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>子セレクター (“parent > child”) - jQueryまとめのカルマ</title>
<script src="http://code.jquery.com/jquery-2.0.0.js"></script>
</head>
<body>
<div id="id-parent">
<p id="id-child">一郎</p>
<p class="contents">二郎</p>
<p class="class-child">さぶちゃん</p>
</div>
</body>
<style>
.add-css {
border: 3px double red;
}
</style>
<script>
$(document).ready(function () {
$("#id-parent > .class-child").addClass("add-css");
});
</script>
</body>
</html>
サンプルをブラウザで確認するとこのように表示されます。該当する要素にクラス.add-cssが追加されたことがわかりますね。
スポンサーリンク