:parent

$(':parent') 1.0追加

テキストを含め、ある要素の親になっているエレメントを選択します。

:parentと正反対のセレクタです。 :parent(:emptyも同様)は、テキストノードも検証対象になるということに注意してください。

W3Cはただのテキストノードを含め<P>要素は、必ず1つの子要素を持たせることを推奨しています。 (Paragraphs, Lines, and Phrases)
一方で子要素を持たせないことが定義づけられている要素も存在します。(例:<input>, <img>, <br>, <hr>)

:parentはjQueryが独自に拡張した仕組みでCSSには存在しない概念です。 そのため、querySelectorAll()によって提供されるパフォーマンスを享受することが出来ません。 最高のパフォーマンスを出すためには、純粋なCSSセレクタのみを使用して要素を特定し、 それに対して.filter(":parent")を適用してください。

デモ

子要素を持つTDを半透明にします。

<!DOCTYPE html>
<html>
<head>
  <style>
  td { width:40px; background:green; }
  </style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <table border="1">
  <tr><td>Value 1</td><td></td></tr>
  <tr><td></td><td>Value 2</td></tr>
</table>
<script>$("td:parent").fadeTo(1500, 0.3);</script>
</body>
</html>

 Back to top

© 2010 - 2017 STUDIO KINGDOM