HTML DOMElementを取得する時のお話。
みんなが大好きjQueryを使うのが一番楽です。
var $main = $('#main .className'); var $mainPs = $('#main p'); |
jQueryを使わないとどうする?
getElementByIdとgetElementsByTagName, getElementsByClassNameを組み合わせて使用することになります。
var mainClass = document.getElementById('main').getElementsByClassName('className'); var mainPs = document.getElementById('main').getElementsByTagName('p'); |
querySelectorAllを使えば簡単だし早い
モダンなブラウザに用意されているquerySelectorAllを使えばjQueryセレクターAPIの様に指定でき配列でデータを取得可能です。
var mainClass = document.querySelector('#main .className'); var mainPs = document.querySelectorAll('#main p'); |
document.getElementByIdの時と違いSelectorにはjQueryと同じように#
とか.
を使います。
先頭の一つだけを取得する querySelector も用意されています。
MDN: document.querySelector
MDN: Document.querySelectorAll
update【訂正】
大きな勘違いでした。
間違っていたので大幅に加筆修正をしました、ごめんなさい。
単純なID指定の場合はgetElementByIdが最速です。
ピンバック: 超個人的メモ, JavaScript関連の投稿リンクをまとめておく « イナヅマTVログ