jsメモ

Dcument.querySelector()関数:文法:

element = document.querySelector(selectors); 

最初のselectorsにマッチしたelementを返します.この選択はクラスに基づいていますが、どう分かりますか?自分で定義した名前ではなく、htmlのデフォルトの名前です.例えば、body、h 1、h 2、h 3、buttonなどです.

var el = document.querySelector(".myclass");

マッチする要素が見つからない場合は、nullを返します.そうでなければ、複数のマッチする要素を見つけたら、最初のマッチする要素を返します.
選択器がIDであり、このIDが文書で何度も誤って使用された場合、最初のIDに一致する要素が返される.
指定されたセレクタが不正であれば、SYNTAX_をスローします.ERR異常
querySelector()はSelectors APIに導入されます.
querySelectorに渡す文字列パラメータはCSSシンタックスに適合していなければなりません.一致するIDまたはセレクタがCSSの構文に合わない場合(例えば、不正にコロンまたはスペースを使用している場合)は、これらの文字をバックスラッシュで変換しなければなりません.JavaScriptでは、バックスラッシュは変換記号ですので、テキスト列を入力すると、それを二回変換しなければなりません.

<div id="foo\bar">div>
<div id="foo:bar">div>

<script>
  console.log('#foo\bar')               // "#fooar"
  document.querySelector('#foo\bar')    //        

  console.log('#foo\\bar')              // "#foo\bar"
  console.log('#foo\\\\bar')            // "#foo\\bar"
  document.querySelector('#foo\\\\bar') //      div

  document.querySelector('#foo:bar')    //        
  document.querySelector('#foo\\:bar')  //      div
script>

IDを使ってDom要素を取得することもできます.

 document.getElementByID("some id");