var odiv = document.queryselector('div');
1,獲取當前標籤中所有的子級節點
執行結果,是乙個偽陣列,可以foreach()
形式是與 queryselectorall() 獲取的偽陣列是一樣的
console.log( odiv.childnodes );
2,獲取當前標籤中,所有的元素節點/標籤節點
執行結果,是乙個偽陣列,不能foreach()
console.log( odiv.children );
3,獲取當前標籤中,第乙個節點
執行結果,是乙個物件,內容形式與dom操作方式,獲取的內容是一樣的
console.dir( odiv.firstchild );
4,獲取當前標籤中,最後乙個節點
執行結果,是乙個物件,內容形式與dom操作方式,獲取的內容是一樣的
console.dir( odiv.lastchild );
console.dir( document.queryselector('span') );
5,獲取當前標籤中,第乙個標籤節點,其他節點不會獲取
console.log( odiv.firstelementchild );
6,獲取當前標籤中,最後乙個標籤節點,其他節點不會獲取
console.log( odiv.lastelementchild );
7,獲取當前標籤,上乙個兄弟節點(找哥哥)
如果沒有執行結果是null
console.log( odiv.previoussibling );
8,獲取當前標籤,下乙個兄弟節點(找弟弟)
如果沒有執行結果是null
console.log( odiv.nextsibling );
9,獲取當前標籤,上乙個兄弟元素節點(找標籤哥哥)
console.log( odiv.previouselementsibling );
10,獲取當前標籤,下乙個兄弟元素節點(找標籤弟弟)
console.log( odiv.nextelementsibling );
11,獲取當前標籤,父級節點
只獲取直接父級節點
console.log( odiv.parentnode );
console.log( document.queryselector('span').parentnode );
12,獲取當前標籤,所有屬性節點
執行結果,是乙個偽陣列,不能foreach()
console.log( odiv.attributes );
總結1,通過節點操作獲取的物件/偽陣列與通過 dom操作的物件/偽陣列,形式上是一致的
可以相互操作,dom方法可以操作 節點物件
節點方法可以操作 dom物件
2,執行結果,偽陣列/物件
偽陣列有的可以foreach, 有的不能foreach
dom獲取節點物件的方法
charset utf 8 title 直接獲取節點物件的方式 方式直接獲取單個物件 function demo1 2.通過標籤獲得元素的物件，獲得的是乙個集合 function demo2 3.通過屬性name 名字叫 hobby獲得 function demo3 間接獲取節點物件的方式 func...
JQuery獲取 this 子節點物件的方法
相信很多剛接觸jquery的人，很多都會對 this 和this的區別模糊不清，那麼這兩者有什麼區別呢？首先來看看jquery中的 這個符號，實際上這個符號在jquery中相當於jquery 即 this jquery 也就是說，這樣可以返回乙個jquery物件。那麼，當你在網頁中alert id ...
JQuery獲取 this 子節點物件的方法
相信很多剛接觸jquery的人，很多都會對 this 和this的區別模糊不清，那麼這兩者有什麼區別呢？首先來看看jquery中的 這個符號，實際上這個符號在jquery中相當於jquery 即 this jquery 也就是說，這樣可以返回乙個jquery物件。那麼，當你在網頁中alert id ...