参考资料

1. HTML 有用的提示
2. Html转义工具有哪些
3. HTML 中最常用的
   容器元素
4. HTML 常用颜色
5. HTML 预期格式文本
6. HTML 表格表头单元格
7. HTML 内部样式表
8. HTML 表格的嵌套

HTML id 属性在 JavaScript 中的使用

基本概念

id 属性是 HTML 元素的唯一标识符，用于在 JavaScript 和 CSS 中定位特定元素。

主要标签

任何 HTML 元素都可以使用 id 属性：

<div id="myDiv"></div>
<p id="myParagraph"></p>
<button id="myButton"></button>

JavaScript 用法

获取元素

// 通过 id 获取元素
const element = document.getElementById('myId');

修改内容

element.innerHTML = '新内容';

修改样式

element.style.color = 'red';
element.style.fontSize = '20px';

添加事件监听

element.addEventListener('click', function() {
  alert('元素被点击');
});

功能

1. 唯一标识：每个 id 在文档中必须是唯一的

2. 快速访问：通过 getElementById() 快速获取元素

3. DOM 操作：修改元素内容、样式和属性

4. 事件处理：绑定交互事件

CSS 扩展

虽然 id 主要用于 JavaScript，但也可以在 CSS 中使用：

#myId {
  color: blue;
  background-color: yellow;
}

选择器优先级

id 选择器比类选择器和标签选择器具有更高的优先级

最佳实践

1. 保持 id 名称有意义且描述性

2. 避免在 CSS 中过度使用 id 选择器

3. 确保 id 在整个文档中是唯一的

4. 使用驼峰命名法或连字符命名法（如 myElement 或 my-element）