DOM 獲取標籤

2022-06-21 18:30:11 字數 1568 閱讀 7091

操作文件的 - html文件

dom要操作的是html文件

標籤名來獲取

var divs = document.getelementsbytagname('div')

console.log(divs);

通過id名來獲取

var div = document.getelementbyid('var')

console.log(div);

通過name屬性來獲取

var users = document.getelementsbyname('username')

console.log(users);

注意:通過name屬性獲取一般多用於表單中,表單一定要有name屬性

通過類名獲取

var boxs = document.getelementsbyclassname('box')

console.log(boxs);

document.queryselector(css選擇器)

var div = document.queryselector('div')

var div = document.queryselector('#var')

//兩者都可以獲取id名為var的div

console。log (div)

滿足css選擇器的第乙個標籤

選擇所有 :

document.queryselectorall('div')

var divs = document.queryselectorall('div')

console.log(divs);

//獲取到的是乙個集合 - 物件 - 偽陣列

console.log(divs.length);

console.log(divs[0]);

操作集合 - 能取下標,能有長度,不能使用陣列方法

for(var i=0;i)

//遍歷這個偽陣列

想要document.queryselectorall獲取的div做個點選事件

for(var i=0;i)

}

總結:

document.queryselector() - 在低版本ie中不相容

document.queryselectorall() - 在低版本ie中不相容

document.getelementsbytagname() - 沒有相容問題

document.getelementbyid() - 沒有相容問題

document.getelementsbyname() - 沒有相容問題

document.getelementsbyclassname() - 在低版本ie中不相容

在dom中獲取html中標籤

獲取元素的三種方法 1 通過id名獲取元素 2 通過class類名獲取元素 3 通過標籤名直接獲取元素 注 id是唯一的 所以用id獲取到的元素可以直接用,通過class類名和標籤名獲取到的元素是乙個陣列,呼叫的時候需要先獲取到具體的某乙個,然後再呼叫。下面是乙個簡單的案例 通過標籤查詢並獲取標籤 ...

DOM 獲取標籤文字及屬性操作

innertext和innerhtml屬性都是用來獲取和設定標籤的內容的。但是二者還是有區別的。innerhtml可以用於獲取和設定標籤的所有內容,包括標籤和文字內容 innerhtml 內部的html 獲取標籤內容的時候,不管標籤還是文字,都能獲取到 innerhtml設定內容的時候,覆蓋原來內容...

DOM 查詢標籤

1 直接查詢 document.getelementbyid 根據id獲取乙個標籤 document.getelementsbyclassname 根據class屬性獲取 document.getelementsbytagname 根據標籤名獲取標籤合集 var ele p document.get...