よくあるコーディングとして

<ul>
<li class="nav01"><span>親カテゴリ</span>
<ul>
<li><a href="">そのメニューたち</a></li>
<li><a href="">そのメニューたち</a></li>
<li><a href="">そのメニューたち</a></li>
<li><a href="">そのメニューたち</a></li>
<li><a href="">そのメニューたち</a></li>
</ul>
</li>
<li class="nav02"><span>親カテゴリー</span>
<ul>
<li><a href="">そのメニューたち</a></li>
<li><a href="">そのメニューたち</a></li>
<li><a href="">そのメニューたち</a></li>
<li><a href="">そのメニューたち</a></li>
<li><a href="">そのメニューたち</a></li>
</ul>
</li>
<li class="nav03"><a>そのままリンク</a></li>
</ul>

よくある。
jqueryとかでliにhoverしたら、その子要素を・・・
でも今回は直接リンクだったり、ただの親要素だったり。
そこでliの子要素が何なのかを見て、実行処理を分ける。

$(“#gNav > ul > li:has(span)”).hover(/////

なんとなくやりやすかったから備忘録。