:lang()【言語属性要素】
:target【URIターゲット属性 対応要素】

メモ

  • ":lang()"：指定した言語属性要素を選択
  • ":target"：URIターゲット属性に対応する要素を選択
    • 但し、直前のリンク先が対象 (CSS指定と相違)

構文

jQuery( ":lang(language【言語コード】)" ) 1.9

language【言語コード】(例)備考
ja日本語
ja-JP日本語 (日本)
en英語
en-UK英語 (イギリス)
en-US英語 (アメリカ)

jQuery( ":target" ) 1.9

関連

例

<div>灰色</div>
<div lang="ja-JP">灰色 (lang="ja-JP")</div>
<div>grey</div>
<div lang="en">grey (lang="en")</div>
<div>gray</div>
<div lang="en-US">gray (lang="en-US")</div>
<br>

<script>
$(":lang(ja-JP)").css( { "background-color":"gray", "color":"white" } ).append(" (ja-JP 対象)");
$(":lang(en)").css( { backgroundColor:"gray", color:"white" } ).append(" (en 対象)");
</script>

灰色
灰色 (lang="ja-JP")
grey
grey (lang="en")
gray
gray (lang="en-US")


<style>
#link4:target { background-color:lightgray; }
</style>

<div id="id2">
  クリックで直前のリンク先が変化
  <div><a href="#link1">リンク１へ</a></div>
  <div><a href="#link2">リンク２へ</a></div>
  <div><a href="#link3">リンク３へ</a></div>
  <div><a href="#link4">リンク４へ (CSS指定)</a></div>
</div>

<br>
<div id="link1">リンク１</div>
<div id="link2">リンク２</div>
<div id="link3">リンク３</div>
<div id="link4">リンク４ (CSS指定)</div>

<script>
$("#id2 a").click(function(){
  $(":target").css( { color:"red", fontWeight:"bold" } );
  $(":not(:target)").css( { color:"black", fontWeight:"normal" } );
});
</script>


リンク１
リンク２
リンク３
リンク４ (CSS指定)