js中節點及其屬性的CRUD

2021-10-18 14:01:09 字數 1254 閱讀 3228

新增元素節點

建立新節點

新增節點

如果節點已存在,將存在的移動到被新增的節點最後,如果不存在,則新增到新增的節點最後

屬性節點

節點 getattribute( 「屬性名」 ) getattribute(「name」)

快速獲取

節點.屬性 seceles[0].classname class,name是關鍵字 屬性用classname

查詢元素是否存在

元素節點.hasattribute(屬性名)

增加或修改屬性

節點 . setattribute( 「屬性名」, 「屬性值」 )

刪除屬性

書寫格式 元素節點 removeattribute(屬性名)

inpele.removeattribute(「class」)

remove方法

元素節點.classlist.remove

建立注釋節點

crearecomment

let comele=document.createcomment("我是乙個注釋")
插入節點

獲取元素節點

父元素節點

插入節點

插入到哪個元素之前

父元素節點.insertbefore(a,b);

a:插入節點 b:插入到哪個節點之前

如果a存在,則移動到b的前面

刪除節點

節點名.remove();

如果刪除是父節點,會把自己和後代一同刪除

替換節點

父元素節點.replacechild(a,b);

a替換b

轉殖節點

識別符號=節點名稱.clonenode(boolean);

深轉殖:true 轉殖節點和後代節點

淺轉殖:false 只轉殖節點,不包含子節點和其他後代

節點的樣式

節點名.style.css屬性名=css屬性值

divele.style.height=300+「px」;

新增css屬性

window.getcomputeredstale 和節點.style的 區別

節點.style獲取的是行內樣式,可讀,可改

window.getcomputeredstale (參一,參二)

獲採樣式 唯讀

參1 元素節點

參2 :

獲取屬性值

window.getcomputeredstale (參一,參二).屬性名

JS節點屬性

屬性 attributes 儲存節點的屬性列表 唯讀 childnodes 儲存節點的子節點列表 唯讀 datatype 返回此節點的資料型別 definition 以dtd或xml模式給出的節點的定義 唯讀 doctype 指定文件型別節點 唯讀 documentelement 返回文件的根元素 ...

js 常用的節點和屬性

childnodes 獲取所有的子節點 children 獲取所有的元素子節點 parentnode 獲取父親節點 previoussibling 獲取上乙個哥哥節點 nextsibling 獲取下乙個弟弟節點 firstchild 獲取所有的子節點中的第乙個 lastchild 獲取所有子節點中的...

JS中的節點

var tab document.getelementbyid tab var box document.getelementbyid box console.dir tab 節點型別 nodetype nodename nodevalue 元素節點 1大寫的標籤名 null 文字節點 3 text...