JavaScript DOM 获取元素：ID、标签名、类名、选择器

JavaScript DOM 获取元素：ID、标签名、类名、选择器

在 JavaScript 中，我们可以通过不同的方法获取 DOM 元素，例如通过 ID、标签名、类名和 CSS 选择器。

1. 通过 ID 获取

使用 document.getElementById() 方法，传入元素的 ID 作为参数，返回匹配的元素对象。

let element = document.getElementById('myElement');

2. 通过标签名获取

使用 document.getElementsByTagName() 方法，传入标签名作为参数，返回一个 HTMLCollection 对象，可以通过索引访问其中元素。

let elements = document.getElementsByTagName('div');
let firstDiv = elements[0];

3. 通过类名获取

使用 document.getElementsByClassName() 方法，传入类名作为参数，返回一个 HTMLCollection 对象，可以通过索引访问其中元素。

let elements = document.getElementsByClassName('myClass');
let firstElement = elements[0];

4. 通过选择器获取

使用 document.querySelector() 方法，传入 CSS 选择器作为参数，返回第一个匹配的元素对象。

let element = document.querySelector('#myDiv .myClass');

5. 通过选择器获取多个元素

使用 document.querySelectorAll() 方法，传入 CSS 选择器作为参数，返回一个 NodeList 对象，可以通过索引访问其中元素。

let elements = document.querySelectorAll('div.myClass');
let firstElement = elements[0];