HTML DOM 访问
HTML DOM（Document Object Model）指的是文档对象模型，表示HTML页面的结构，包括页面元素及其属性。
HTML DOM访问指的是通过编程方式访问HTML文档中的元素及其属性，包括获取元素、修改元素、删除元素等。
HTML DOM操作分为以下几个步骤：
- 获取文档对象 在JavaScript中，可以通过以下语句获取文档对象：
var doc = document;
- 获取元素对象 可以使用以下方法获取元素对象：
- 通过元素的id获取：
document.getElementById("elementId") - 通过元素的标签名获取：
document.getElementsByTagName("tagName") - 通过元素的class名获取：
document.getElementsByClassName("className") - 通过CSS选择器获取：
document.querySelector("selector")或document.querySelectorAll("selector")
- 修改元素属性 可以通过以下方法修改元素的属性：
- 获取元素对象后，可以通过直接设置其属性来修改。
var element = document.getElementById("elementId");
element.className = "newClass";
element.style.color = "red";
- 也可以使用
setAttribute()和removeAttribute()方法来修改属性和移除属性。
var element = document.getElementById("elementId");
element.setAttribute("title", "newTitle");
element.removeAttribute("disabled");
- 操作元素内容 可以通过以下方法来操作元素的内容：
- 获取元素的文本内容：
element.textContent或element.innerText
var element = document.getElementById("elementId");
var text = element.textContent;
- 设置元素的内容：
element.innerHTML或element.outerHTML
var element = document.getElementById("elementId");
element.innerHTML = "<span>new content</span>";
- 创建和删除元素 可以通过以下方法来创建和删除元素：
- 创建元素：
document.createElement("tagName")
var newElement = document.createElement("div");
- 插入元素：
parentElement.appendChild(childElement)或parentElement.insertBefore(newElement, referenceElement)
var parent = document.getElementById("parentId");
var child = document.createElement("div");
parent.appendChild(child);
var parent = document.getElementById("parentId");
var newElement = document.createElement("div");
var referenceElement = document.getElementById("referenceId");
parent.insertBefore(newElement, referenceElement);
- 删除元素：
parentElement.removeChild(childElement)
var parent = document.getElementById("parentId");
var child = document.getElementById("childId");
parent.removeChild(child);
以上是HTML DOM访问的基本操作。虽然操作简单，但在页面交互和动态效果实现中起着至关重要的作用。