jQuery API の jQuery( ':lang( language )' ) は、引数「language」に指定した言語コードの要素を全て選択する。
記述方法(構文)
jQuery( 'セレクター:lang( 言語コード )' )
「セレクター」にマッチした要素のうち、lang属性値が「言語コード」である要素を選択する。
引数
- language / 言語コード
「ja」や「en-us」などの、言語コードを指定。
記述例
jQuery( '.sample div:lang( ja )' )
クラス名が「sample」の要素の子孫要素である div 要素のうち、言語コードが「ja」である div 要素を選択。
実装例(サンプル)
ja
en
en-us
es-es
実装例(サンプル)のソースコード
JavaScript
<script type="text/javascript">
<!--
jQuery( function() {
jQuery( '#sample div:lang( ja )' ) . css( 'background-color', 'blue' );
jQuery( '#sample div:lang( en )' ) . css( 'background-color', 'purple' );
jQuery( '#sample div:lang( en-us )' ) . css( 'background-color', 'green' );
jQuery( '#sample div:lang( es-es )' ) . css( 'background-color', 'red' );
} );
// -->
</script>
<!--
jQuery( function() {
jQuery( '#sample div:lang( ja )' ) . css( 'background-color', 'blue' );
jQuery( '#sample div:lang( en )' ) . css( 'background-color', 'purple' );
jQuery( '#sample div:lang( en-us )' ) . css( 'background-color', 'green' );
jQuery( '#sample div:lang( es-es )' ) . css( 'background-color', 'red' );
} );
// -->
</script>
HTML
<div id="sample">
<div lang="ja">ja</div>
<div lang="en">en</div>
<div lang="en-us">en-us</div>
<div lang="es-es">es-es</div>
</div>
<div style="clear: left;"></div>
<div lang="ja">ja</div>
<div lang="en">en</div>
<div lang="en-us">en-us</div>
<div lang="es-es">es-es</div>
</div>
<div style="clear: left;"></div>
CSS
<style>
<!--
#sample div{
float: left;
margin: 10px;
padding: 10px;
width: 100px;
text-align: center;
font-size: 20px;
color: white;
border: 1px solid gray;
border-radius: 10px;
}
// -->
</style>
<!--
#sample div{
float: left;
margin: 10px;
padding: 10px;
width: 100px;
text-align: center;
font-size: 20px;
color: white;
border: 1px solid gray;
border-radius: 10px;
}
// -->
</style>