HTML DOM 元素對象
HTML DOM 節點
在HTML DOM (Document Object Model)中,每個東西都是節點 :
- 文檔本身就是一個文檔對象
- 所有HTML 元素都是元素節點
- 所有HTML 屬性都是屬性節點
- 插入到HTML 元素文本是文本節點
- 註釋是註釋節點
元素對象
在HTML DOM中, 元素對象代表著一個HTML元素。
元素對象的子節點可以是,可以是元素節點，文本節點，註釋節點。
NodeList對象代表了節點列表，類似於HTML元素的子節點集合。
元素可以有屬性。 屬性屬於屬性節點（查看下一章節）。
瀏覽器支持
所有主流瀏覽器都支持元素對象和NodeList 對象。 .
屬性和方法
以上屬性和方法可適用於所有HTML 元素：
| 屬性/ 方法 | 描述 |
|---|---|
| element .accessKey | 設置或返回accesskey一個元素 |
| element .addEventListener() | 向指定元素添加事件句柄 |
| element .appendChild() | 為元素添加一個新的子元素 |
| element .attributes | 返回一個元素的屬性數組 |
| element .childNodes | 返回元素的一個子節點的數組 |
| element .classlist | 返回元素的類名，作為DOMTokenList 對象。 |
| element .className | 設置或返回元素的class屬性 |
| element.clientHeight | 在頁面上返回內容的可視高度（不包括邊框，邊距或滾動條） |
| element.clientWidth | 在頁面上返回內容的可視寬度（不包括邊框，邊距或滾動條） |
| element .cloneNode() | 克隆某個元素 |
| element .compareDocumentPosition() | 比較兩個元素的文檔位置。 |
| element .contentEditable | 設置或返回元素的內容是否可編輯 |
| element .dir | 設置或返回一個元素中的文本方向 |
| element .firstChild | 返回元素的第一個子節點 |
| element .focus() | 設置文檔或元素獲取焦點 |
| element .getAttribute() | 返回指定元素的屬性值 |
| element .getAttributeNode() | 返回指定屬性節點 |
| element .getElementsByTagName() | 返回指定標籤名的所有子元素集合。 |
| element . getElementsByClassName() | 返回文檔中所有指定類名的元素集合，作為NodeList 對象。 |
| element.getFeature() | 返回指定特徵的執行APIs對象。 |
| element.getUserData() | 返回一個元素中關聯鍵值的對象。 |
| element .hasAttribute() | 如果元素中存在指定的屬性返回true，否則返回false。 |
| element .hasAttributes() | 如果元素有任何屬性返回true，否則返回false。 |
| element .hasChildNodes() | 返回一個元素是否具有任何子元素 |
| element .hasfocus() | 返回布爾值，檢測文檔或元素是否獲取焦點 |
| element .id | 設置或者返回元素的id。 |
| element .innerHTML | 設置或者返回元素的內容。 |
| element .insertBefore() | 現有的子元素之前插入一個新的子元素 |
| element .isContentEditable | 如果元素內容可編輯返回true，否則返回false |
| element .isDefaultNamespace() | 如果指定了namespaceURI 返回true，否則返回false。 |
| element .isEqualNode() | 檢查兩個元素是否相等 |
| element .isSameNode() | 檢查兩個元素所有有相同節點。 |
| element .isSupported() | 如果在元素中支持指定特徵返回true。 |
| element .lang | 設置或者返回一個元素的語言。 |
| element .lastChild | 返回的最後一個子元素 |
| element .namespaceURI | 返回命名空間的URI。 |
| element .nextSibling | 返回該元素緊跟的一個元素 |
| element .nodeName | 返回元素的標記名（大寫） |
| element .nodeType | 返回元素的節點類型 |
| element .nodeValue | 返回元素的節點值 |
| element .normalize() | 使得此成為一個"normal"的形式，其中只有結構（如元素，註釋，處理指令，CDATA節和實體引用）隔開Text節點，即元素（包括屬性）下面的所有文本節點，既沒有相鄰的文本節點也沒有空的文本節點 |
| element.offsetHeight | 返回，任何一個元素的高度包括邊框和填充，但不是邊距 |
| element.offsetWidth | 返回元素的寬度，包括邊框和填充，但不是邊距 |
| element.offsetLeft | 返回當前元素的相對水平偏移位置的偏移容器 |
| element.offsetParent | 返回元素的偏移容器 |
| element.offsetTop | 返回當前元素的相對垂直偏移位置的偏移容器 |
| element .ownerDocument | 返回元素的根元素（文檔對象） |
| element .parentNode | 返回元素的父節點 |
| element .previousSibling | 返回某個元素緊接之前元素 |
| element .querySelector() | 返回匹配指定CSS 選擇器元素的第一個子元素 |
| document.querySelectorAll() | 返回匹配指定CSS 選擇器元素的所有子元素節點列表 |
| element .removeAttribute() | 從元素中刪除指定的屬性 |
| element .removeAttributeNode() | 刪除指定屬性節點並返回移除後的節點。 |
| element .removeChild() | 刪除一個子元素 |
| element .removeEventListener() | 移除由addEventListener() 方法添加的事件句柄 |
| element .replaceChild() | 替換一個子元素 |
| element.scrollHeight | 返回整個元素的高度（包括帶滾動條的隱蔽的地方） |
| element.scrollLeft | 返回當前視圖中的實際元素的左邊緣和左邊緣之間的距離 |
| element.scrollTop | 返回當前視圖中的實際元素的頂部邊緣和頂部邊緣之間的距離 |
| element.scrollWidth | 返回元素的整個寬度（包括帶滾動條的隱蔽的地方） |
| element .setAttribute() | 設置或者改變指定屬性並指定值。 |
| element .setAttributeNode() | 設置或者改變指定屬性節點。 |
| element.setIdAttribute() | |
| element.setIdAttributeNode() | |
| element.setUserData() | 在元素中為指定鍵值關聯對象。 |
| element.style | 設置或返回元素的樣式屬性 |
| element .tabIndex | 設置或返回元素的標籤順序。 |
| element .tagName | 作為一個字符串返回某個元素的標記名（大寫） |
| element .textContent | 設置或返回一個節點和它的文本內容 |
| element .title | 設置或返回元素的title屬性 |
| element.toString() | 一個元素轉換成字符串 |
| nodelist .item() | 返回某個元素基於文檔樹的索引 |
| nodelist .length | 返回節點列表的節點數目。 |