jQuery 隣接セレクタ

jQueryの隣接セレクタについて

隣接セレクタはあまり実務では使いませんよね？
使うとしたらどのような場面で使用したりしますか？

No.1 ベストアンサー 回答者： yambejp 回答日時： 2017/02/08 10:03

使う人は使うと思いますけどね・・・

<script>
$(function(){
$('.b+.c').css('color','red');
});
</script>
<div class="a">a1</div>
<div class="b">b1</div>
<div class="c">c1</div><!--隣接してる-->
<div class="d">d1</div>
<hr>
<div class="a">a2</div>
<div class="b">b2</div>
<div class="d">d2</div>
<div class="c">c2</div><!--隣接してない-->
<hr>
<div class="a">a3</div>
<div class="c">c3</div><!--隣接してるけど逆順-->
<div class="b">b3</div>
<div class="d">d3</div>

No.2 回答者： Ogre7077 回答日時： 2017/02/08 13:28

特定できる要素を起点にして、特定しづらい要素を指定するのによく使います。

// 見出し(h2)を残して、そのレベル以下の内容(section)をすべて隠す
$('h2 + section').hide();

<h1>名作の冒頭</h1>
<section>
<h2>平家物語</h2><section><p>祇園精舎の鐘の声...</section>
<h2>鏡の中の鏡</h2><section><p>許して、ぼくはこれより大きな声ではしゃべれない...</section>
<h2>ガリア戦記</h2>
<section>
<h3>一年目</h3><section><p>ガリアは全体で三つの区画に分かれている...</section>
<h3>二年目</h3><section><p>こうして前述のように、カエサルが...</section>
</section>
</section>