JS獲取子節點 父節點和兄弟節點

2021-09-12 11:38:37 字數 1952 閱讀 5888

js獲取父節點

js獲取兄弟節點

var a = document.

getelementbyid

("test").

getelementsbytagname

("div"

);

//陣列格式,不包含換行和空格

var getfirstchild = document.

getelementbyid

("test"

).children[0]

;//陣列的格式,包含換行和空格。

var b =document.

getelementbyid

("test"

).childnodes;

//去掉換行的空格

for(

var i=

0; i//補充

document.

getelementbyid

("test"

).childelementcount;

//可以直接獲取長度 同length

//不會匹配換行和空格資訊。

var getfirstchild = document.

getelementbyid

("test"

).firstelementchild;

//獲取第乙個子節點,包含換行和空格,有時候會返回undefined

var getfirstchild = document.

getelementbyid

("test"

).firstchild;

// 獲取最後乙個子節點,規則同上

var getlastchild = document.

getelementbyid

("test"

).lastelementchild;

var getlastchild = document.

getelementbyid

("test"

).lastchild;

var p = document.

getelementbyid

("test"

).parentnode;

var p1 = document.

getelementbyid

("test"

).parentelement;

var p2 = document.

getelementbyid

("test"

).offsetparent;

//獲取所有父節點

var brother1 = document.

getelementbyid

("test"

).parentnode.children[1]

;//獲取上乙個兄弟節點

var brother2 = document.

getelementbyid

("test"

).previouselementsibling;

//直接匹配節點

var brother3 = document.

getelementbyid

("test"

).previoussibling;

//包含換行空格

//獲取下乙個兄弟節點

var brother4 = document.

getelementbyid

("test"

).nextelementsibling;

var brother5 = document.

getelementbyid

("test"

).nextsibling;

JS獲取父節點 子節點 兄弟節點

1 訪問父節點 parentnode node 型別,返回指定節點的父節點,如果指定節點沒有父節點,則返回 null box hello hello world p div var hello document.getelementbyid hello console.log hello.paren...

jquery獲取父節點 子節點 兄弟節點

test parent expr 找父親節點,可以傳入expr進行過濾,比如 span parent 或者 span parent class test parents expr 類似於jquery.parents expr 但是是查詢所有祖先元素,不限於父元素 test children expr...

DOM獲取節點的兄弟,父節點,子節點

先說一下js的獲取方法,其要比jquery的方法麻煩很多,後面以jquery的方法作對比。js的方法會比jquery麻煩很多,主要則是因為ff瀏覽器,ff瀏覽器會把你的換行也當最dom元素 原生的js獲取id為test的元素下的子元素。可以用 var a docuemnt.getelementbyi...