JavaScript最常用于獲取或修改HTML元素的內(nèi)容或值以及應用某些效果。
為此，您必須首先找到元素。做這件事有很多種方法：
通過ID查找HTML元素
通過標簽名稱查找HTML元素
通過類名稱查找HTML元素
通過CSS選擇器查找HTML元素
通過HTML對象集合查找HTML元素
您可以使用getElementById()方法根據(jù)元素的唯一ID選擇元素。
這是在DOM樹中找到HTML元素的最簡單方法。
以下示例選擇一個具有ID屬性id="msg"的元素：
var x = document.getElementById("msg");測試看看?/?如果找到該元素，則該方法將把該元素作為對象返回。
如果找不到該元素，則myElement將包含null。
您還可以使用getElementsByTagName()方法通過標記名稱選擇HTML元素。
此方法返回具有指定標簽名稱的文檔中所有元素的類似數(shù)組的列表。
本示例選擇所有<p>元素：
var x = document.getElementsByTagName("p");測試看看?/?更改文檔中所有段落元素的背景色：
var x = document.getElementsByTagName("p");
for(let i = 0; i < x.length; i++) {
x[i].style.backgroundColor = "coral";
}測試看看?/?本示例選擇id="wrapper"的元素，然后選擇“ wrapper”內(nèi)的所有<p>元素：
var x = document.getElementById("wrapper");
var y = x.getElementsByTagName("p");測試看看?/?您可以使用該getElementsByClassName()方法選擇具有特定類名稱的所有元素。
此方法返回具有指定類名的文檔中所有元素的類似數(shù)組的列表。
此示例返回所有帶有class="demo"的元素的列表：
var x = document.getElementsByClassName("demo");測試看看?/?您可以使用該querySelectorAll()方法來選擇與指定的CSS選擇器匹配的元素（ID，類，類型等）。
此方法返回與指定選擇器匹配的所有元素的類似數(shù)組的列表。
CSS選擇器提供了一種非常強大有效的選擇文檔中HTML元素的方法。
var x = document.querySelectorAll("div");測試看看?/?此示例返回帶有“ note”類的文檔中所有<div>元素的列表：
var x = document.querySelectorAll("div.note");測試看看?/?HTML文檔中最頂層的元素可以直接用作文檔屬性。
例如，可以使用屬性訪問<html>元素document.documentElement。
所述元件可以與被訪問document.body屬性。
var html = document.documentElement; var body = document.body;測試看看?/?
注意：如果document.body在標記之前使用（例如，在<head>內(nèi)），它將返回null而不是body元素。
也可以訪問以下HTML對象（和對象集合）：
| 屬性 | 描述 |
|---|---|
| document.anchors | 返回所有具有名稱屬性的<a>元素 |
| document.applets | 返回所有<applet>元素（在HTML5中已棄用） |
| document.baseURI | 返回文檔的絕對基本URI |
| document.body | 返回元素 |
| document.cookie | 返回文檔的cookie |
| document.doctype | 返回文檔的文檔類型 |
| document.documentElement | 返回<html>元素 |
| document.documentMode | 返回瀏覽器使用的模式 |
| document.documentURI | 返回文檔的URI |
| document.domain | 返回文檔服務器的域名 |
| document.domConfig | 已廢棄；返回DOM配置 |
| document.embeds | 返回所有<embed>元素 |
| document.forms | 返回所有<form>元素 |
| document.head | 返回<head>元素 |
| document.images | 返回所有<img>元素 |
| document.implementation | 返回DOM實現(xiàn) |
| document.inputEncoding | 返回文檔的編碼（字符集） |
| document.lastModified | 返回文檔更新的日期和時間 |
| document.links | 返回所有具有href屬性的<area>和<a>元素 |
| document.readyState | 返回文檔的（加載中）狀態(tài) |
| document.referrer | 返回引用者的URI（鏈接文檔） |
| document.scripts | 返回所有<script>元素 |
| document.strictErrorChecking | 返回是否強制執(zhí)行錯誤檢查 |
| document.title | 返回<title>元素 |
| document.URL | 返回文檔的完整URL |