閱讀(14k) 書簽贊(1) 我要糾錯

HTML DOM getElementsByClassName() 方法

2018-09-29 17:39 更新

HTML DOM getElementsByClassName() 方法

Document 對象參考手冊 Document 對象

實例

獲取所有指定類名的元素：

var x =document.getElementsByClassName("example");

嘗試一下 ?

定義和使用

getElementsByClassName() 方法返回文檔中所有指定類名的元素集合，作為 NodeList 對象。

NodeList 對象代表一個有順序的節(jié)點列表。NodeList 對象我們可通過節(jié)點列表中的節(jié)點索引號來訪問列表中的節(jié)點(索引號由0開始)。

提示： 你可以使用 NodeList 對象的length 屬性來確定指定類名的元素個數(shù)，并循環(huán)各個元素來獲取你需要的那個元素。

瀏覽器支持

表格中的數(shù)字表示支持該方法的第一個瀏覽器的版本號。

方法
getElementsByClassName()	4.0	9.0	3.0	3.1	9.5

語法

document.getElementsByClassName(classname)

參數(shù)

參數(shù)	類型	Description
classname	String	必須。你需要獲取的元素類名。多個類名使用空格分隔，如 "test demo"。

技術(shù)描述

DOM 版本:	Core Level 1 Document Object
返回值：	NodeList 對象，表示指定類名的元素集合。元素在集合中的順序以其在代碼中的出現(xiàn)次序排序。

實例

獲取包含 "example" 和 "color" 類名的所有元素:

var x =document.getElementsByClassName("example color");

嘗試一下 ?

實例

查看文檔中有多少個樣式 class="example" 的元素 (使用 NodeList 對的 length 屬性):

var x =document.getElementsByClassName("example").length;

嘗試一下 ?

實例

修改所有樣式 class="example" 元素的背景顏色：

var x = document.getElementsByClassName("example");
var i;
for (i = 0; i < x.length; i++) {
x[i].style.backgroundColor = "red";
}

嘗試一下 ?

HTML DOM getElementsByClassName() 方法

HTML DOM getElementsByClassName() 方法

實例

定義和使用

瀏覽器支持

語法

參數(shù)

技術(shù)描述

更多實例

實例

實例

實例

相關(guān)頁面

HTML DOM getElementsByClassName() 方法

HTML DOM getElementsByClassName() 方法

實例

定義和使用

瀏覽器支持

語法

參數(shù)

技術(shù)描述

更多實例

實例

實例

實例

相關(guān)頁面

推薦文章

推薦教程

推薦課程