jQuery API の jQuery( ':has( selector )' ) は、「selector」で指定した子孫要素を持つ要素を選択する。
記述方法
jQuery( 'セレクター:has( 子孫要素 )' )
「セレクター」に一致した要素のうち、「子孫要素」で指定した子孫要素を持つ要素を選択。
実装例（サンプル）
- 項目１
- 項目１－１
- 項目１－２
- 項目２
- 項目２－１
- 項目２－２
- 項目２－２－１
- 項目２－２－２
- 項目２－３
- 項目３
実装例（サンプル）のソースコード
JavaScript
<script type="text/javascript">
<!--
jQuery( function() {
jQuery( '#jquery-api-has li:has(ul)' ) . css( {
color: 'red',
listStyleType: 'disc',
} );
} );
// -->
</script>
<!--
jQuery( function() {
jQuery( '#jquery-api-has li:has(ul)' ) . css( {
color: 'red',
listStyleType: 'disc',
} );
} );
// -->
</script>
CSS
<style>
<!--
#jquery-api-has li {
color: #303030;
list-style-type: square;
}
-->
</style>
<!--
#jquery-api-has li {
color: #303030;
list-style-type: square;
}
-->
</style>
HTML
<ul id="jquery-api-has">
<li>項目１
<ul>
<li>項目１－１</li>
<li>項目１－２</li>
</ul>
</li>
<li>項目２
<ul>
<li>項目２－１</li>
<li>項目２－２
<ul>
<li>項目２－２－１</li>
<li>項目２－２－２</li>
</ul>
</li>
<li>項目２－３</li>
</ul>
</li>
<li>項目３</li>
</ul>
<li>項目１
<ul>
<li>項目１－１</li>
<li>項目１－２</li>
</ul>
</li>
<li>項目２
<ul>
<li>項目２－１</li>
<li>項目２－２
<ul>
<li>項目２－２－１</li>
<li>項目２－２－２</li>
</ul>
</li>
<li>項目２－３</li>
</ul>
</li>
<li>項目３</li>
</ul>