#id【id 指定要素】

メモ

  • 指定id要素を選択
    • JavaScript：document.getElementById()【要素取得 (id属性 指定)】を使用 (高速)
    • 他のセレクタと組み合わせると低速 (例：タグ名と組み合わせ "h2#header2")
    • 0個 または 1個のDOM要素配列を含む jQueryオブジェクトを返却
    • 同じid要素が複数ある場合(不正なドキュメント)、初めのDOM要素を選択 (但し、信頼すべきでない)
    • idにメタキャラクタ( !"#$%&'()*+,./:;<=>?@[\]^`{|}~ ) を含む場合、 2つのバックスラッシュ( \\ ) でエスケープが必要 (例："#id.id:id" → "#id\\.id\\:id")
      下記 例 参照

構文

jQuery( "#id【id】" )1.0

関連

例

<span id="id1">コンテンツ (id1)</span>
<span id="id2">コンテンツ (id2)</span>

<script>
  $( "#id1" ).css( { color:"red", border:"2px red dashed" } );
  $( "#id2" ).css( { color:"blue", border:"3px blue double" } );
</script>

コンテンツ (id1) コンテンツ (id2) 

<p>
<span id="idA.idB">コンテンツ (idA.idB)</span>
<span id="idX:idY">コンテンツ (idX:idY)</span>
</p>

<script>
  $( "#idA.idB" ).append(" (処理１)").css( "border-top", "2px red dashed" );
  $( "#idA\\.idB" ).append(" (処理２)").css( "border-bottom", "2px red dashed" );

  $( "#idX:idY" ).append(" (処理３)").css( "border-top", "3px blue double" );
  $( "#idX\\:idY" ).append(" (処理４)").css( "border-bottom", "3px blue double" );
</script>

コンテンツ (idA.idB) コンテンツ (idX:idY)