如何在 javascript 中使用 dom： 使用 dom（文檔對象模型）在 javascript 中操作 html/xml 文檔。具體步驟包括：獲取元素、操作元素、創(chuàng)建新元素、插入/移除元素，以及遍歷 dom 樹。
如何在 JavaScript 中使用 DOM
JavaScript 中的 DOM（文檔對象模型）是一個用于表示和操作 HTML 和 XML 文檔的對象。它允許開發(fā)者以編程方式訪問和修改網(wǎng)頁內(nèi)容。
使用 DOM 的步驟：
1. 獲取 DOM 元素
使用 document.getElementById() 或 document.querySelector() 方法獲取特定元素。
const element = document.getElementById("my-element");
登錄后復(fù)制
2. 操作元素
使用屬性和方法來修改元素的內(nèi)容、樣式和行為。
innerHTML: 設(shè)置或獲取元素的 HTML 內(nèi)容。
style: 設(shè)置或獲取元素的 CSS 樣式。
className: 設(shè)置或獲取元素的類名。
addEventListener(): 為元素添加事件監(jiān)聽器。
3. 創(chuàng)建新元素
使用 document.createElement() 方法創(chuàng)建新的 HTML 元素。
const newElement = document.createElement("p");
newElement.innerHTML = "Hello World!";
登錄后復(fù)制
4. 插入和移除元素
使用 appendChild() 和 removeChild() 方法將元素插入或移除文檔。
5. 遍歷 DOM
使用 childNodes、parentNode 和 nextSibling 屬性遍歷 DOM 樹。
示例：
修改具有 ID 為 “my-element” 的元素的文本內(nèi)容：
const element = document.getElementById("my-element");
element.innerHTML = "Updated Content";
登錄后復(fù)制
添加一個 “active” 類到具有類名 “button” 的所有元素：
const buttons = document.querySelectorAll(".button");
buttons.forEach((button) => button.classList.add("active"));
登錄后復(fù)制
