脱jQueryのためのメモ。
要素を取得するためのメソッド
- ID指定の場合は
document.getElementById、それ以外はdocument.querySelectorAll(1要素だけ取得する場合はdocument.querySelector)を使う document.getElementsByClassNameは使わない(戻り値であるHTMLCollectionはブラウザによってはiterableではない=forEachなどが使えない)- 入力値の取得は
document.getElementById('xxx').valueのようにvalueプロパティを使う - 属性値の取得/設定は
el.getAttribute('foo')とel.setAttribute('foo', 'bar')を使う(elはElementオブジェクト)
戻り値
document.getElementByIdとdocument.querySelectorはElementオブジェクトdocument.querySelectorAllはNodeList、document.querySelectorは最初にマッチしたElementオブジェクトdocument.getElementsByClassNameとdocument.getElementsByTagNameはHTMLCollectionオブジェクト- セレクタにマッチしなかった場合、jQueryは空配列を返すが、DOM APIはNULLを返す
- 戻り値をfor inやforeachでループさせると、ブラウザによって挙動が変わるので注意が必要
