jQuery API の jQuery( ':header' ) は、h1、h2、h3などのようなヘッダー要素をすべて選択する。
記述方法
jQuery( 'セレクター:header' )
セレクターに一致した要素のうち、ヘッダー要素を選択。
実装例(サンプル)
h1 要素
p 要素
h2 要素
p 要素
h3 要素
p 要素
h4 要素
p 要素
h5 要素
p 要素
h6 要素
p 要素
実装例(サンプル)のソースコード
JavaScript
<script type="text/javascript">
<!--
jQuery( function() {
jQuery( '#jquery-api-header :header' ) . css( {
backgroundColor: 'yellow',
color: 'red',
fontSize: '15px',
border: '1px solid orange',
} );
} );
// -->
</script>
<!--
jQuery( function() {
jQuery( '#jquery-api-header :header' ) . css( {
backgroundColor: 'yellow',
color: 'red',
fontSize: '15px',
border: '1px solid orange',
} );
} );
// -->
</script>
HTML
<div id="jquery-api-header">
<h1>h1 要素</h1>
<p>p 要素</p>
<h2>h2 要素</h2>
<p>p 要素</p>
<h3>h3 要素</h3>
<p>p 要素</p>
<h4>h4 要素</h4>
<p>p 要素</p>
<h5>h5 要素</h5>
<p>p 要素</p>
<h6>h6 要素</h6>
<p>p 要素</p>
</div>
<h1>h1 要素</h1>
<p>p 要素</p>
<h2>h2 要素</h2>
<p>p 要素</p>
<h3>h3 要素</h3>
<p>p 要素</p>
<h4>h4 要素</h4>
<p>p 要素</p>
<h5>h5 要素</h5>
<p>p 要素</p>
<h6>h6 要素</h6>
<p>p 要素</p>
</div>