# 元素的属性与事件
在现实世界中我们通常使用名字、年龄、性别、外貌等内容来描述一个人,同样的在HTML中也有描述元素的内容(例如元素的名称、样式等),我们统称其为属性
(例如下方指定元素名称的name属性,指定元素样式的style属性)。
html
预览
# 属性的组成
一个属性必须包含如下三个部分内容:属性名称
、等号
以及属性值(由一对单/双引号引起来)
注意
在属性和元素名称之间(如果已经有一个或多个属性,就与前一个属性之间)有一个空格
# 全局属性
全局属性是所有 HTML 元素共有的属性,它们可以用于所有元素,即使属性可能对某些元素不起作用
。我们可以在所有的 HTML 元素上指定全局属性,甚至是在标准里没有指定的元素。这意味着任何非标准元素仍必须能够应用这些属性,即使使用这些元素意味着文档不再是 html5 兼容的。
属性名 | 作用 | 属性值 |
---|---|---|
accesskey | 提供了为当前元素生成键盘快捷键的提示 | 可打印的字符 |
autocapitalize | 控制用户的文本输入是否和如何自动大写 | 枚举类型:off or none 所有字母都默认为小写字母on or sentences : 每个句子的第一个字母默认为大写字母,其他字母都默认为小写字母words : 每个单词的第一个字母默认为大写字母;所有其他字母都默认为小写字母characters : 所有的字母都默认为大写 |
class | 一个以空格分隔的元素的类名(classes)列表,它允许 CSS 和 Javascript 通过类选择器 或 DOM 方法来选择和访问特定的元素。 | 字符串 |
contenteditable | 表示元素是否可被用户编辑。如果可以,浏览器会修改元素的组件以允许编辑。 | 枚举类型:true、false |
data-* | 被称为自定义数据属性的属性,它赋予我们在所有 HTML 元素上嵌入自定义数据属性的能力,并可以通过脚本在 HTML 与 DOM 表现之间进行专有数据的交换。 | 字符串 |
dir | 指示元素中文本方向 | 枚举类型: ltr,指从左到右 rtl,指从右到左 auto,指由用户代理决定方向。 |
draggable | 元素是否允许使用拖放操作API拖动 | 枚举类型:true、false |
hidden | 表示元素是否被隐藏 | 布尔类型:true、false |
id | 定义了一个全文档唯一的标识符 (ID)。它用于在链接(使用片段)、脚本和样式(通过CSS)中辨识元素。 | 字符串 |
is | 允许您指定标准 HTML 元素像定义的内置元素一样工作 | 字符串 |
lang | 表示元素的语言 | BCP47语言定义 |
part | 包含一个以元素中 part 属性名称组成的列表,该列表以空格分隔。通过 Part 的名称,可以使用 CSS 伪元素“::part”来选择 shadow 树中指定元素并设置其样式。 | 字符串 |
slot | 将一个 shadow 树中的槽分配给一个元素:带有 slot 属性的元素分配给由slot创建的槽,它的 name 属性的值匹配 slot 属性的值。 | 字符串 |
style | 包含应用到元素的 CSS 样式声明。 | 字符串 |
tabindex | 指示其元素是否可以聚焦,以及它是否/在何处参与顺序键盘导航(通常使用Tab键,因此得名)。 | 整数 |
title | 表示咨询信息文本,和它属于的元素相关。这个信息通常存在,但绝不必要,作为提示信息展示给用户。 | 字符串 |
translate | 用来规定对应元素的属性值及其子文本节点内容,是否跟随系统语言作出对应的翻译变化。 | 枚举类型:yes、no |
itemid | 代表元素的唯一的全局标识符,用于Microdata技术 | 字符串 |
itemprop | 被用于向一个物体中添加属性,用于Microdata技术 | 字符串 |
itemref | 提供了元素 id(并不是 itemid)的列表,并具有文档其它地方的额外属性,用于Microdata技术 | 字符串 |
itemscope | 它定义了一个与元数据关联的数据项,用于Microdata技术 | 布尔 |
itemtype | 指定了词汇的 URL,它将会用于定义数据结构中的 itemprop(条目属性),用于Microdata技术 | url |