CSSセレクタ指定で要素を取得するには、.querySelector()／.querySelectorAll()を使用します。
querySelectorは、単一要素を取得します。
querySelectorAllは、複数要素を取得します。
サンプルソース
単一要素）id="hoge"の要素を取得する
|
1 2 3 4 5 |
//要素取得 var obj = document.querySelector("#hoge"); //要素のinnerTextを取得 var a = obj.innerText; |
複数要素）class="hoge"の要素を取得する
|
1 2 3 4 5 6 7 |
//要素取得 var obj = document.querySelectorAll(".hoge"); //要素取得 for(var i=0;i<obj.length;i++){ var a = obj[i].innerText; } |
解説
- 指定したCSSセレクタ要素が存在しない場合はnullが返ります。
- querySelectorで複数要素が存在する場合は、１つめの要素が返ります。