HTML 属性参考

在 HTML 中，大多数属性都有两个方面：内容属性和 IDL（接口描述语言）属性。

内容属性需要你在内容（HTML 代码）中设置，而且可以通过 element.setAttribute() 或 element.getAttribute() 来设置。内容属性总是一个字符串，即使里面的值是一个整数。例如，要将 <input> 元素的 maxlength 设置为 42，你需要在元素上调用 setAttribute("maxlength", "42")。

IDL 属性（attribute）也就是 JavaScript 属性（property）。你可以使用 JavaScript 属性如 element.foo 来设置这些属性。当你需要获取 IDL 属性的值时，IDL 属性总会使用隐含的内容属性的值（可能先经过转换）来返回一个值。同样地，当你设置这个值时，这个值会保存在内容属性中。换句话说，IDL 属性本质上反映了内容属性。

大多数时候，IDL 属性会返回元素实际使用的值。例如，<input> 的默认 type 是“text”，所以如果你设置 input.type="foobar"，<input> 元素仍然会是文本类型（在外观上和表现上），但 type 内容属性的值是“foobar”。然而，type IDL 属性依旧会返回字符串“text”。

IDL 属性并不总是字符串；例如 input.maxlength 是一个数字（有符号长整型）。使用 IDL 属性时，你读取或设置值的类型都是要求的类型。所以 input.maxlength 总会返回一个数字，而如果你要设置 input.maxlength，也需要使用数字。如果你传入了别的类型，则会根据标准 JavaScript 的类型转换规则被转换为数字。

IDL 属性可以反映其他类型，如无符号长整型、URL、布尔类型，等。不幸的是，并没有清晰的规则定义一个属性的 IDL 属性与对应的内容属性如何关联。大多数时候，这会遵守规范中列出的规则，但有时并不遵守。HTML 规范尝试将这件事尽可能变得对开发者友好，但由于很多原因（大多是历史原因），一些属性表现得很奇怪（例如 select.size），你就需要阅读规范以理解它们实际是如何表现的。

一些内容属性（例如 required、readonly、disabled）是布尔属性。如果一个布尔值属性存在，则其值为真（true），如果不存在，其值为假（false）。

HTML 定义了布尔属性允许的取值：如果属性存在，其值必须是一个空字符串（或未给该属性赋值），或者是一个大小写无关的 ASCII 字符串，该字符串与属性名严格相同，前后都没有空格。以下示例是为一个布尔值属性取值的几个有效方式。

<div itemscope>这是一个有效的 HTML，但不是有效的 XML。</div>
<div itemscope=itemscope>这也是有效的 HTML，但不是有效的 XML。</div>
<div itemscope="">这是有效的 HTML，也是有效的 XML。</div>
<div itemscope="itemscope">这也是有效的 HTML 或 XML，但可能有点冗长。</div>

再明确一点，布尔值属性不能取值为 "true" 和 "false"。如果需要表示假值，布尔值属性需要整个忽略不写。这个限制消除了一些常见的误解：比如在元素中设置 checked="false"，元素的 checked 属性会被解析为 true，因为这个属性出现了。

除了上表中列出的属性，全局事件处理器（例如 onclick）也可以作为内容属性在所有元素上指定。

所有事件处理器属性都接受字符串值。字符串将用于合成 JavaScript 函数，例如 function name(/*args*/) {body}，其中，name 为属性名，body 为属性值。处理器接收与其 JavaScript 事件处理器对应项相同的参数——大多数处理器只接收一个 event 参数，而 onerror 接收五个参数：event、source、lineno、colno、error。这意味着你通常可以在属性中使用 event 变量。

<div onclick="console.log(event)">点击这里！</div>
<!-- 合成的处理器具有名称，你可以引用处理器本身 -->
<div onclick="console.log(onclick)">点击这里！</div>

• HTML 元素