js原生dom操作

//1.建立元素

var a=document.createelement("a");
var node1 = document.createelement('div');
var node2 = document.createtextnode('hello world!');
//2.新增子元素、刪除子元素
document.body.removechild(a);
//3.替換子元素
document.body.replacechild(newele,oldele);
//4.插入子元素
document.insertbefore(newele,referele);
//5.轉殖當前元素
ele.clonenode(true) //該引數指示被複製的節點是否包括原節點的所有屬性和子節點
//6.設定屬性
ele.setattribute("style","font-size:15px;color:red");
//7.獲取指定屬性
ele.getattribute("href");
//8.判斷、移除屬性
el.hasattribute('class');
el.removeattribute('class');
//9.是否有屬性設定
el.hasattributes();

元素六大關係

dom樹

原生JS操作DOM

複製 var one document.queryselector one one.style.color blue 複製 1.getelementsbyclassname 2.queryselectorall 複製 因為js獲得的節點中返回所有類是乙個陣列，所以要對其進行迴圈控制 用迴圈長度的方式...

原生js操作Dom命令總結

常用的dom方法 document.getelementbyid box 通過id獲取標籤 document.getelementsbytagname div 根據標籤名獲取頁面元素 注意 由於獲取結果可能是多個，element後面要加s 根據標籤獲取的結果是偽陣列形式，偽陣列是不具備陣列的方法。要...

原生js和Jquery操作DOM

dom元素節點 1 文件節點 2 元素節點 3 屬性節點 4 文字節點 5 注釋節點 1 建立節點 2 選擇 訪問 節點 3 操作 1 節點操作 1 新增節點 2 刪除節點 3 替換節點 4 修改內容 1 文字 text 2 html 3 表單val 4 改變事件 2 css操作 3 動畫 下文 一...