:empty【空要素】
:parent【中身有り要素】

メモ

  • 空要素・中身有り要素を選択
    • :empty【空要素】 ⇔ :parent【中身有り要素】(中身が有るので親)
    • 子要素が空要素のみでも:parent【中身有り要素】の対象
  • パフォーマンス (:parent)
    • ネイティブ DOM querySelectorAll() 未使用の為、低速
      純粋なCSSセレクタを使用後、.filter(":parent") を使用した方が高速 ( 例 参照)

構文

【空要素】
jQuery( ":empty" ) 1.0


【中身有り要素】
jQuery( ":parent" ) 1.0

関連

例

<style>
#id1 th { width:50px; }
#id1 td { width:50px; }
.empty { background-color:lightgray; }
.parent { background-color:lightgreen; }
.parent2 { border:2px red dashed; }
</style>

<table id="id1">
  <tr><td><td>Data<td></tr>
  <tr><td>Data<td><span></span><td>Data</tr>
  <tr><td><td>Data<td></tr>
</table>

<script>
$( "#id1 td:empty" ).addClass( "empty" );
$( "#id1 td:parent" ).addClass( "parent" );
$( "#id1 td" ).filter(":parent").addClass( "parent2" );
</script>

Data
DataData
Data