js的html元素的父節點,子節點

2021-06-20 13:45:08 字數 936 閱讀 9363

**:

parentnode和parentelement功能一樣,childnodes和children功能一樣。

但是parentnode和childnodes是符合w3c標準的,可以說比較通用

。而另外兩個只是ie支援,不是標準,firefox就不支援

示例:"parentnode" 常用來獲取某個元素的父節點. 把 parentnodes 理解為容器, 在容器中有個子節點 ,如下:

my text

在上面的**中, 你看到把"爹"作為乙個 div 容器, 該容器中有個"孩子", 就是粗體的文字部分. 如果你打算用getelementbyid() 方法獲取粗體元素並且想知道它"爹"是誰, 返回的資訊將是乙個 div. 演示下面的指令碼如下:

用 parentnode 不一定只找到乙個"爹", "兒子"也可以成為"爹", 如下面的例子 ...

my text

上面這段**中有兩個"爹"和兩個"孩子". 頭乙個 div ( id "parent") 是第二個 div (childparent) 的"爹".   在 "childparent" 中有個粗體元素(id "child"), 是 "childparent" div 的"孩子". 那麼, 如何訪問到"爺爺" (id "parent")?如下:

注意到兩個 parentnode 連用了嗎? "parentnode.parentnode". 第乙個 parentnode 是 div ( id "childparent"), 因為我們要得到最外層的父元素, 所以另外加了乙個 parentnode 就到了 div ( id "parent").

使用 parentnode 不只找到某個元素的 nodename, 還會更多. 例如, 你可以獲取包含大量元素的父節點, 並在末尾新增乙個新的節點.   ie 有它自己的名稱叫做 "parentelement", 對於交叉瀏覽器指令碼建議使用 parentnode

js的html元素的父節點,子節點

parentnode和parentelement功能一樣,childnodes和children功能一樣。但是parentnode和childnodes是符合w3c標準的,可以說比較通用。而另外兩個只是ie支援,不是標準,firefox就不支援 示例 parentnode 常用來獲取某個元素的父節點...

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

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

jquery 獲取元素 父節點,子節點,兄弟節點

test1 parent 父節點 test1 parents 全部父節點 test1 parents mui content 返回class為mui content的父節點 test1 children 全部子節點 test1 children test1 返回id為test1的子節點 test1 ...