首頁 >web前端 >js教程 >如何在 JavaScript 中以類別名稱選擇元素?

如何在 JavaScript 中以類別名稱選擇元素?

Linda Hamilton
Linda Hamilton原創
2024-11-02 12:09:021059瀏覽

How do I Select Elements by Class Name in JavaScript?

如何透過類別名稱取得元素

在 JavaScript 中,使用 document.getElementById() 方法透過 ID 擷取元素非常簡單。然而,按類別獲取元素略有不同,最初可能會引起混亂。

按類別選擇元素的正確方法名稱是 document.getElementsByClassName()。這是因為網頁上的多個元素可以共享同一個類,因此使用“Elements”,它會傳回 NodeList 或類似數組的物件。

這是一個範例:

<code class="javascript">var elementsByClass = document.getElementsByClassName('class_name');
console.log(elementsByClass[0]); // Accesses the first element with the provided class name</code>

如果需要將NodeList轉換為實際的數組,可以使用以下方法:

<code class="javascript">var arrayFromList1 = Array.prototype.slice.call(elementsByClass);

// Alternatively, you can use the following syntax to convert the NodeList to an array
var arrayFromList2 = [].slice.call(elementsByClass);</code>

值得注意的是,使用querySelector()或querySelectorAll()按類別選擇元素一般是由於更好的跨瀏覽器支援而成為首選。

最後,建議參考 MDN 等信譽良好的來源以獲取準確且最新的 JavaScript 資訊。

以上是如何在 JavaScript 中以類別名稱選擇元素?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn