原生JS操作DOM

2021-09-11 13:10:06 字數 1210 閱讀 5793

複製**

var one = document.queryselector('.one');

one.style.color="blue";

複製**

1.getelementsbyclassname()

2.queryselectorall()

複製**

因為js獲得的節點中返回所有類是乙個陣列,所以要對其進行迴圈控制 用迴圈長度的方式

1.var two = document.queryselectorall('.two');

for(var i=0;i複製**

el.getattribute('class')

el.getattribute('id')

複製**

ele.setattribute('class','sss');

複製**

el.hasattribute('class'); el.removeattribute('class');

複製**

var one = document.getelementbyid("oneid");

one.classlist.add("mystyle","ssss");

one.classlist.remove("mystyle");

var twoclick = document.queryselectorall('.twoclick');

for (var i = 0; i < twoclick.length; i++) )

}複製**

function hasclass(obj, cls) 

function addclass(obj, cls)

function removeclass(obj, cls)

}

function toggleclass(obj,cls)else

} 複製**

var two = document.getelementsbyclassname('two');

for(var i=0;i複製**

js原生dom操作

1.建立元素 var a document.createelement a var node1 document.createelement div var node2 document.createtextnode hello world 2.新增子元素 刪除子元素 document.body.r...

原生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 動畫 下文 一...