節點的介紹及使用方法
阿新 • • 發佈:2019-01-10
- 頂級物件 : 文件的物件 document
* 元素: 頁面上所有的標籤 element
* 節點: 頁面上所有的內容(標籤, 屬性, 文字(文字, 換行, 空格)) node
* 根元素: html標籤
*
* 節點的屬性
* .nodeType : 節點的型別 : 1–標籤 2-屬性 3-文字
* .nodeName: 節點的名字: 大寫的標籤名字–>標籤節點 小寫的屬性名字—>屬性的節點
* #text—> 文字的節點
* .nodeValue: 節點的值 : null—>標籤節點 屬性的值—>屬性節點 文字的內容–>文字節點
//第一個子節點
console.log(u.firstChild); // 在ie8中 顯示的是第一個子元素
//第一個子元素
console.log(u.firstElementChild); // 在ie8中 不支援
//最後一個子節點
console.log(u.lastChild);// 在ie8中 顯示的是最後一個子元素
//最後一個子元素
console.log(u.lastElementChild);// 在ie8中 不支援
console.log("================================================") //獲取前一個兄弟節點 console.log(u.previousSibling) ; // 在ie8中 顯示的是前一個兄弟元素 //獲取前一個兄弟元素 console.log(u.previousElementSibling); // 在ie8中 不支援 //獲取後一個兄弟節點 console.log(u.nextSibling); // 在ie8中 顯示的是後一個兄弟元素 //獲取後一個兄弟元素 console.log(u.nextElementSibling); // 在ie8中 不支援 /* * 總結: 凡是獲取元素和節點, 在谷歌和火狐 都支援 * 從子節點和兄弟節點開始, 獲取節點的程式碼 在ie8中 得到的元素 * 獲取元素的程式碼, 得到的是undfined
小案例