JavaScript 获取元素的名称

在 JavaScript 中，有多种方法可以获取元素的名称。这些方法可以用于不同的情况，比如获取单个元素或多个元素，获取元素的 ID 或类名。

通过 ID 获取元素

通过元素的 ID 获取元素是最常见的方法之一。可以使用 document.getElementById() 方法获取具有指定 ID 的元素。

let element = document.getElementById("element-id");

上面的代码将获取 ID 为 "element-id" 的元素并将其存储在 element 变量中。如果找不到具有指定 ID 的元素，则 element 变量将为 null。

通过类名获取元素

除了通过 ID 获取元素外，还可以通过类名获取元素。可以使用 document.getElementsByClassName() 方法获取一个包含指定类名的元素列表。该方法返回的是一个 HTMLCollection 对象，这意味着您可以使用数组索引来访问它。

let elements = document.getElementsByClassName("element-class");

上面的代码将获取所有类名为 "element-class" 的元素列表并将其存储在 elements 变量中。如果找不到具有指定类名的元素，则 elements 变量将为一个空的 HTMLCollection 对象。

通过标签名获取元素

除了通过 ID 或类名获取元素外，还可以通过标签名获取元素。可以使用 document.getElementsByTagName() 方法获取一个包含指定标签名的元素列表。该方法也返回一个 HTMLCollection 对象。

let elements = document.getElementsByTagName("div");

上面的代码将获取所有 div 标签的元素列表并将其存储在 elements 变量中。如果找不到具有指定标签名的元素，则 elements 变量将为一个空的 HTMLCollection 对象。

通过选择器获取元素

除了上述方法之外，还可以使用 document.querySelector() 或 document.querySelectorAll() 方法来根据 CSS 选择器获取元素。document.querySelector() 方法将返回匹配第一个选择器的元素，而 document.querySelectorAll() 方法将返回所有匹配选择器的元素。

let element = document.querySelector("#element-id");
let elements = document.querySelectorAll(".element-class");

上面的代码将分别获取 ID 为 "element-id" 的元素和所有类名为 "element-class" 的元素列表。

总结

JavaScript 中有多种方法可以获取元素的名称。您可以使用 document.getElementById()、document.getElementsByClassName()、document.getElementsByTagName()、document.querySelector() 或 document.querySelectorAll() 方法来获取元素。根据您的需求，选择适合您的方法即可。