js節點操作總結

2021-08-25 02:44:07 字數 1426 閱讀 6286

在對一些元素進行節點操作的時候需要通過對其父節點以及其他有關係的節點來進行相關設定,以下為部分層級關係的獲取

元素.parentnode  //獲取父元素節點
元素.firstelementchild  //獲取第乙個子節點,也有firstchild來獲取的,但是存在bug
元素.children  //獲取所有子節點
元素.ownerdocument  //獲取該節點文件根節點
元素.previouselementsibling //獲取當前節點的前乙個同級節點
元素.nextelementsibling //獲取當前節點的後乙個同級節點
var newnode = document.createelement("節點型別")

newnode.innerhtml = "建立的節點內容"

找到要追加節點的父元素

追加的節點一般由一二中的方法建立乙個節點,也可以是轉殖的節點

要轉殖的節點.clonenode(true)  //傳入引數true則複製所有節點內容
此處的要轉殖的節點經常會用層級關係來獲取

直接父元素.insertbefore(要插入的節點,插入位置的後乙個節點)

//在使用的時候前面的父元素必須是新舊元素共同的父元素

注意!!在對table操作時會自動出現tbody,使得tr的直接父元素不再是table,一般用html dom來對**進行操作

父節點.removechild(要移除的節點)
父節點.replacechild(要換成的節點,被替換的節點)
tableb**物件

屬性:rows

返回包含**中所有行的乙個陣列

方法:insertrow()在**中插入乙個新行

deleterow()從**中刪除一行

tablerow**行物件

屬性:cells 返回包含行中所有單元格的乙個陣列

rowindex 返回該行在**中的位置

方法:insertcell() 在一行中指定的位置插入乙個空 的標籤

deletecell()刪除行中指定單元格

tablecell單元格物件

屬性:cellindex:返回單元格在某行中的位置

innerhtml:設定或返回單元格的開始標籤和結束標籤之間的html

align設定或返回單元格內部資料的水平排列方式

classname 設定或返回元素的class屬性

js節點操作

每個節點都有乙個 parentnode 屬性,該屬性指向文件樹中的父節點。包含在 childnodes 列表中的所有節點都具有相同的父節點,因此它們的 parentnode 屬性都指向同乙個節點。此外,包含在childnodes 列表中的每個節點相互之間都是同胞節點。通過使用列表中每個節點的 pre...

Js節點操作

一 節點常用操作 二 節點屬性 屬性操作的標準方法 node.getattribute 返回當前元素節點的指定屬性。如果指定屬性不存在,則返回null node.setattribute 為當前元素節點新增屬性。如果同名屬性已存在 node.hasattribute 返回乙個布林值,表示當前元素節點...

js 節點操作

新增和刪除節點 html 元素 如需向 html dom 新增新元素,您必須首先建立該元素 元素節點 然後向乙個已存在的元素追加該元素。這是乙個段落 這是另乙個段落 例子解釋 這段 建立新的 元素 var para document.createelement p 如需向 元素新增文字,您必須首先建...