DOM

JavaScriptによるHTMLのDOM要素の操作についてメモ

要素の取得

document.documentElement	ルートノード(html要素)へアクセス
document.body	body要素へアクセス
document.getElementById(x)	xで表現されるid値をもったElementノードへのアクセス
document.getElementsByClassName(x)	xで表現されるclass値をもったElementノードリストへのアクセス
document.getElementsByTagName(x)	xで表現される要素名（タグ）をもったElementノードリストへのアクセス
document.querySelector(x)	xで表現されるCSSセレクタに該当する最初のElementノードへのアクセス
document.querySelectorAll(x)	xで表現されるCSSセレクタに該当するElementノードリストへのアクセス

指定のノードからの相対的な位置を指定した要素の取得

element.firstChild	最初の子要素にアクセス
element.lastChild	最後の子要素にアクセス
element.childNodes	子要素のノードリストにアクセス
element.nextSibling	次の兄弟要素にアクセス
element.previousSibling	前の兄弟要素にアクセス
element.parentNode	親要素にアクセス
element.textContent	子孫要素にテキストノードがあれば、その値をすべて取得
element.innerText	子孫要素にテキストノードがあれば、その値をすべて取得（IE）

ある要素以下のテキストの取得

var text = element.innerText || element.textContent;