HTML 概览中简要介绍了属性；现在，我们来深入探讨一下。
属性是 HTML 如此强大的根本原因。属性是开头标记中以空格分隔的名称和名称/值对，用于提供元素的相关信息和功能。
属性用于定义元素的行为、关联和功能。有些属性是全局属性，这意味着它们可以在任何元素的开头标记中显示。其他属性适用于多个元素，但不适用于所有元素，而其他属性则因元素而异，仅与单个元素相关。在 HTML 中，除了布尔属性和在某种程度上枚举的属性之外，所有属性都需要值。
如果属性值包含空格或特殊字符，则必须用英文引号括起。因此，为了提高可读性，我们始终建议使用引号。
虽然 HTML 不区分大小写，但某些属性值会区分大小写。HTML 规范中的值不区分大小写。
定义的字符串值（例如类和 ID 名称）区分大小写。如果某个属性值在 HTML 中区分大小写，那么在 CSS 和 JavaScript 中将其用作属性选择器的一部分时，它也会区分大小写；否则，它不会区分大小写。
布尔值属性
如果存在布尔值属性，则该属性始终为 true。布尔属性包括 autofocus、inert、checked、disabled、required、reversed、allowfullscreen、default,、loop、autoplay、controls、muted、readonly、multiple, 和 selected。如果存在其中一个（或多个）属性，则表示相应元素处于停用、必填、只读等状态；如果不存在，则表示相应元素不处于这些状态。
布尔值可以省略、设置为空字符串，也可以是属性的名称；但值实际上不必设置为字符串 true。所有值（包括 true、false 和 😀）虽然无效，但都会解析为 true。
以下三个标记是等效的：
如果属性值为 false，请省略该属性。如果该属性为 true，请添加该属性，但不要提供值。例如，required="required" 在 HTML 中不是有效值；但由于 required 是布尔值，因此无效值会解析为 true。不过，由于无效的枚举属性不一定会解析为与缺失值相同的值，因此养成省略值的习惯比记住哪些属性是布尔值，哪些属性是枚举值，以及哪些属性可能会提供无效值更容易。
在 true 和 false 之间切换时，请使用 JavaScript 完全添加和移除该属性，而不是切换值。
const myMedia = document.getElementById("mediaFile");
myMedia.removeAttribute("muted");
myMedia.setAttribute("muted");
请注意，在 SVG 等 XML 语言中，所有属性（包括布尔属性）都需要包含值。
枚举属性
枚举属性有时会与布尔值属性混淆。它们是具有一组有限的预定义有效值的 HTML 属性。与布尔属性一样，如果存在此类属性但缺少值，则会采用默认值。例如，如果您添加
请尝试将 style 的 color 更改为除 inherit 之外的其他值。然后，尝试将 style 更改为 p 选择器。请勿移除 display 属性，否则样式块将消失。
自定义属性
我们仅介绍了 HTML 全局属性的皮毛。还有更多属性仅适用于一个或一组有限的元素。即使定义了数百个属性，您可能仍需要使用规格中未涵盖的属性。HTML 可以满足您的需求。
您可以通过添加 data- 前缀来创建任何自定义属性。您可以使用以 data- 开头且后跟不以 xml 开头且不包含冒号 (:) 的任何小写字符串来命名属性。
虽然 HTML 具有容错性，如果您创建的属性不受支持且不以 data 开头，或者您自定义属性以 xml 开头或包含 :，系统也不会中断，但创建以 data- 开头的有效自定义属性会带来一些好处。使用自定义数据属性，您可以确保自己不会意外使用现有属性名称。自定义数据属性具有前瞻性。
虽然浏览器不会为任何特定的 data- 前缀属性实现默认行为，但有一个内置的数据集 API 可用于迭代自定义属性。自定义属性是通过 JavaScript 传达特定于应用的信息的绝佳方式。以 data-name 的形式向元素添加自定义属性，并使用 DOM 对相关元素使用 dataset[name] 访问这些属性。
data-first-name="Blendan" data-last-name="Smooth"
data-formerly="Margarita Maker" data-aspiring="Load Balancer"
data-year-graduated="2022">
HAL and EVE could teach a fan to blow hot air.
您可以使用完整的属性名称使用 getAttribute()，也可以使用更简单的 dataset 属性。
el.dataset["machineLearning"]; // workshop
e.dataset.machineLearning; // workshop
dataset 属性会返回每个元素的 data- 属性的 DOMStringMap 对象。
上有多个自定义属性。借助数据集属性，您无需知道这些自定义属性的名称和值，即可访问它们：for (let key in el.dataset) {
customObject[key] = el.dataset[key];
}
本文中的属性是全局属性，这意味着它们可以应用于任何 HTML 元素（但并非所有属性都会对这些元素产生影响）。接下来，我们将深入探讨链接，并介绍介绍图片中未提及的两个属性（target 和 href）以及其他一些特定于元素的属性。
检查您的理解情况
测试您对属性的了解程度。
id 在文档中应是唯一的。
错误
请重试。
正确
正确！
选择格式正确的自定义属性。
data-birthday
正确
birthday
请重试。
data:birthday
重试