在前端开发中，我们常常需要根据元素的类名来获取该元素并执行相应的操作。getElementsByClassName()方法是通过类名来获取元素的一种常用方式。但是，如果一个元素同时拥有多个类名，我们该如何使用getElementsByClassName()方法呢？本文将详细介绍如何使用getElementsByClassName()方法获取拥有两个类名的元素以及相关的学习和指导意义。
1. 获取拥有两个类名的元素
要获取拥有两个类名的元素，可以使用以下代码：
----- -------- - --------------------------------------- ---------
其中，'class1 class2'表示同时具有两个类名的元素，多个类名之间使用空格分隔。这样就可以获取到同时拥有'class1'和'class2'这两个类名的所有元素。
需要注意的是，getElementsByClassName()方法返回的是一个 HTMLCollection 对象，而不是数组。因此，如果想要使用数组的相关方法，需要先将 HTMLCollection 转换为数组。可以使用以下代码将其转换：
----- ----------- - ---------------------
2. 学习和指导意义
掌握如何使用getElementsByClassName()方法获取拥有两个类名的元素对于开发实际项目非常有用。通常情况下，我们会为元素添加多个类名，以便在 CSS 中进行样式控制。在 JS 中，我们同样需要根据元素的多个类名来执行相应的操作。
此外，当一个元素同时具有多个类名时，我们也可以使用classList属性来获取和操作这些类名。例如，可以通过以下代码添加一个新的类名：
-----------------------------------
3. 示例代码
下面是一个示例代码，演示如何使用getElementsByClassName()方法获取拥有两个类名的元素，并将其转换为数组并输出至控制台：
--------- -----
------
------
----------------------------- ------------
-------
------- -
------ ----
-
------- -
---------- -----
-
--------
-------
------
-- --------------------- ----------
-- --------------------- ----------
-- ------------- -------------- ----------
--------
----- -------- - --------------------------------------- ---------
----- ----------- - ---------------------
-------------------------
---------
-------
-------以上就是关于如何使用getElementsByClassName()方法获取拥有两个类名的元素的详细介绍。希望本文对读者有所帮助！
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/25641