Feng's Daily

HTML全局属性介绍

前言

HTML中存在很多全局属性,但是我们可能却对此并不了解,所以我做一下整理和解释。

目录

accesskey

html4

accesskey = character

这个属性提供了一种使用快捷键访问当前元素的途径。它是用一个字符(单个Unicode code)列表的独立规范构成。

在HTML4.01里,accesskey只能指定一个字符,并且不是一个全局属性,它只适用于<a>, <area>, <button>, <input>, <label>, <legend> 和 <textarea>。

在HTML5中,accesskey成为了一个全局属性,你可以为任何元素添加这个属性。

accesskey的处理模型如下:

元素的指定访问键是从accesskey的属性中导出的一种组合键。起初,一个元素是没有指定访问键的。
每当元素的accesskey属性被设置,更改或者移除,用户代理就会更新元素的指定访问键。更新的规则如下:

  1. 如果一个元素没有accesskey属性,那么跳到下面的fallback步骤;

  2. 通过空格分离元素的属性,然后让keys成为一个resulting tokens;

  3. 对keys中的每个值依次执行如下步骤:

    1. 如果这个值不是一个单一字符的字符串(单个Unicode code),这个值则跳过余下的步骤;

    2. 如果这个值不对应一个系统键盘按键,这个值则跳过余下的步骤;

    3. 如果用户代理

  4. (可选)用户代理可以把它选择的组合键作为元素的指定访问键,然后跳过这些步骤;

  5. 如果执行到了这一步,那么这个元素没有指定访问键。

class

class = cdata-list

尽管规范中并没有规定,但是请在页面中语义化使用class。

contenteditable

html5

contenteditable属性是一个可枚举的元素属性,它的值可以是空字符串,true或者false。空字符串或者ture属性映射为true状态。而false则映射到false状态。除此之外,在缺少默认值和存在无效的默认值时还有第三种状态,继承状态。

true状态表示这个元素是可以编辑的,而在继承状态下如果它的父元素是可编辑的那么继承状态下的元素也是可编辑的。false状态则表明元素是不可编辑的。

element.contentEditable [ = value ]
//返回 "true""false",or "inherit",结果取决于元素contenteditable属性的值。
//可以设置或者更改状态.
//如果新的属性不是"true""false",或者"inherit"这三个字符串中的一个,将抛出语法错误。
element.isContentEditable
//如果这个元素是可写的,将返回true,如果不是,将返回false

contextmenu

html5

一个context menu是一个菜单,出现在用户的交互里,比如一次右击。HTML5允许我们自定义这个菜单。

contextmenu属性赋给元素的上下文菜单。

data-*

这类的属性,被称为自定义属性,允许HTML与和它对应DOM表现形式之间的专有信息交换,这或许对script来说有用。这样被设置了这个属性的element就可以通过的HTMLElement的接口访问所有的自定义数据。HTMLElement.dataset属性提供了访问它们的权限。

*可以被任何符合以下限制的the producton rule of xml names(xml的命名规则)代替:

  1. 名字不能以xml开头,除此之外其他任何情形都可是使用这3个字母;

  2. 名字不能含有分号;

  3. 名字不能含有大写字母。

dir

html4

这个可枚举属性表明element的文本方向。

在html4.01中,它可以有两个值,ltr和rtl。而在html5中,新增了auto值。

  • ltr,left to right,适用于从左向右写的语言(比如:英语);
  • rtl,right to left,适用于从右向左写的语言(比如:阿拉伯语);
  • auto,由代理决定,用一个最基础的算法来解析element中的字符,如果发现有一个字符具有很强的方向性,那么就把这个方向作为整个element的方向。

  • HTML 4.01 Specification

  • WHATWG HTML Living Standard

draggable

html5

这个可枚举的属性决定一个element是否能够被拖动,可以使用Drag and Drop API

它有三种状态,当这个属性的值为true时为true状态。false时为false状态,第三种为auto,为缺省值。
true状态意味着元素可拖动,而false状态不可以拖动。当状态为auto时,元素是否可拖动取决于用户代理的默认行为。

element.draggable [ = valindexue ]
//如果这个元素可以拖动则返回true,除此之外返回false。
//可以设置或者覆盖默认值而设置一个拖动属性值。

dropzone

html5**未实现**

这个可枚举的属性决定丢到一个element上的内容类型,可以使用的Drag and Drop API

它的值有:

  • copy, 表示丢放时会创建一个被拖拽element的副本;
  • move, 表示被拖拽的element被移动到这个新位置;
  • link, 将会给拖拽的数据(dragged data)创建一个链接。

  • HTML5, section 8.6.8

hidden

html5

id

这个属性是唯一的标识,它在整个document里应该是唯一的。当需要链接(使用片段标识符,锚点),执行脚本,控制样式时,可以用它来定位识别元素。

item

lang

spellcheck

html5

这个可枚举的属性定义element是否检查拼写错误。它的值可以是:

style

这个属性包含CSS样式声明,被应用到元素上。为了标准标签的语义化,请尽量减少style的使用。
另外,style中的样式拥有除了important之外的最高级优先级。

tabindex

title

总结

本文介绍了HTML中的全局属性,希望大家在使用时能注意到一些注意点。

欢迎大家多去看w3c标准。