:header【見出し要素 セレクタ】
:root【ルート要素 セレクタ】

メモ

  • 特定要素を選択
  • パフォーマンス (:header)
    • ネイティブ DOM querySelectorAll() 未使用の為、低速
      純粋なCSSセレクタを使用後、 .filter(":header") を使用した方が高速

構文

jQuery( ":header" ) 1.2

jQuery( ":root" ) 1.9

関連

<section id="id1">
  <h5>見出し (h5)</h5>
    <p>内容</p>
  <h6>見出し (h6)</h6>
    <p>内容</p>
</section>

<script>
$("#id1 :header").css("background-color", "lightblue");
</script>
見出し (h5)

内容

見出し (h6)

内容


<section id="id2">
  <h5>見出し (h5)</h5>
    <p>内容</p>
  <h6>見出し (h6)</h6>
    <p>内容</p>
</section>

<script>
$("#id2 *").filter(":header").css("background-color", "lightgreen");
</script>
見出し (h5)

内容

見出し (h6)

内容


<p id="output"></p>

<script>
var msg = "ルートタグ:" + $( ":root" )[ 0 ].nodeName;
$( "#output" ).html( msg );
</script>