HTML DOM 属性

HTML DOM 属性是指 HTML 元素节点所拥有的特定属性，这些属性包含了元素的各种信息和配置。通过 HTML DOM，可以使用 JavaScript 来访问、修改和操作这些属性，从而实现对网页内容和行为的控制。

以下是一些常见的 HTML DOM 属性：

1. id：元素的唯一标识符。 <div id="myDiv"></div>
2. className：元素的 CSS 类名。 <div class="myClass"></div>
3. innerHTML：元素的 HTML 内容。 <div id="myDiv">This is the content</div>
4. value：表单元素（input、textarea 等）的值。 <input type="text" id="myInput" value="Initial Value">
5. src：图像、音频、视频等媒体元素的源文件路径。 <img src="image.jpg">
6. href：链接的目标 URL。 <a href="https://example.com">Link</a>
7. style：元素的样式属性。 <div id="myDiv" style="color: red; font-size: 16px;">Styled Div</div>
8. title：元素的标题，通常会在鼠标悬停时显示。 <div title="Tooltip text">Hover me</div>
9. disabled：表示元素是否被禁用。 <button disabled>Disabled Button</button>
10. checked：表示复选框或单选按钮是否被选中。 <input type="checkbox" checked> Checked

通过 JavaScript，可以使用以下方式来访问和操作这些属性：

// 获取属性值
var id = element.id;
var className = element.className;
var innerHTML = element.innerHTML;
var value = inputElement.value;
var src = imgElement.src;
var href = linkElement.href;
var style = divElement.style.color;
var title = divElement.title;
var disabled = buttonElement.disabled;
var checked = checkboxElement.checked;

// 设置属性值
element.id = "newId";
element.className = "newClass";
element.innerHTML = "New content";
inputElement.value = "New value";
imgElement.src = "new_image.jpg";
linkElement.href = "https://newurl.com";
divElement.style.color = "blue";
divElement.title = "New tooltip text";
buttonElement.disabled = true;
checkboxElement.checked = true;

HTML DOM 属性允许开发者动态地修改元素的属性值，从而实现对网页内容和行为的定制和控制。