如何使用 JavaScript 按 ID 選擇元素

在 JavaScript 中，您幾乎可以使用 getElementById() 根據其唯一 ID 從 DOM 中選擇任何元素 方法。它返回與給定 ID 匹配的第一個元素，即 null 如果在文檔中沒有找到匹配的元素。

以下示例顯示瞭如何使用 getElementById() 方法從 DOM 中選擇一個元素，並將其背景顏色更改為紅色：

// grab element from DOM
const elem = document.getElementById('protip');

// change background color to red
elem.style.backgroundColor = 'red';

上面的示例將使用 id="protip" 更新元素的背景顏色 通過使用內聯樣式。

getElementById() 方法提供了一種通過 ID 選擇 DOM 元素的快速且安全的方法。它適用於所有現代和舊瀏覽器，包括 Internet Explorer。

或者，您也可以使用 querySelector() 方法通過 ID 選擇一個 HTML 元素：

const elem = document.querySelector('#protip');

要通過任意 CSS 選擇器（如類、標籤名稱或 ID）選擇 DOM 元素，可以使用 querySelectorAll() 方法。它返回與給定 CSS 選擇器匹配的所有 DOM 元素。

看看如何選擇 DOM 元素教程，了解更多關於在 JavaScript 中獲取 DOM 元素的不同方法。