path: root/files/zh-cn/web/html/global_attributes/index.html

---
title: 全局属性
slug: Web/HTML/Global_attributes
tags:
  - Attribute
  - HTML
  - Reference
  - Web
translation_of: Web/HTML/Global_attributes
---
<p>{{HTMLSidebar("Global_attributes")}}</p>

<p><strong>全局属性</strong>是所有HTML元素共有的属性; 它们可以用于所有元素，即使属性可能对某些元素不起作用。</p>

<p>我们可以在所有的HTML元素上指定全局属性，甚至是在标准里没有指定的元素。这意味着任何非标准元素仍必须能够应用这些属性，即使使用这些元素意味着文档不再是html5兼容的。例如，虽然<code>&lt;foo&gt;</code>不是一个有效的HTML元素，但是html5兼容的浏览器隐藏了标记为<code>&lt;foo hidden&gt;...&lt;foo&gt;</code>的内容。</p>

<p>除了基本的HTML全局属性之外，还存在以下全局属性:</p>

<ul>
 <li>{{htmlattrdef("xml:lang")}} 和 {{htmlattrdef("xml:base")}} ——两者都是从XHTML规范继承，但为了兼容性而被保留的。</li>
 <li>多重<code><a href="https://developer.mozilla.org/zh-CN/docs/Web/Accessibility/ARIA">aria-*</a></code>属性，用于改善可访问性。</li>
 <li><a href="https://developer.mozilla.org/zh-CN/docs/Web/Guide/Events/Event_handlers">事件处理程序</a> 属性：<strong><code>onabort</code></strong>, <code><strong>onautocomplete</strong></code>, <code><strong>onautocompleteerror</strong></code>, <code><strong>onblur</strong></code>, <code><strong>oncancel</strong></code>, <code><strong>oncanplay</strong></code>, <code><strong>oncanplaythrough</strong></code>, <code><strong>onchange</strong></code>, <code><strong>onclick</strong></code>, <code><strong>onclose</strong></code>, <code><strong>oncontextmenu</strong></code>, <code><strong>oncuechange</strong></code>, <code><strong>ondblclick</strong></code>, <code><strong>ondrag</strong></code>, <code><strong>ondragend</strong></code>, <code><strong>ondragenter</strong></code>, <code><strong>ondragexit</strong></code>, <code><strong>ondragleave</strong></code>, <code><strong>ondragover</strong></code>, <code><strong>ondragstart</strong></code>, <code><strong>ondrop</strong></code>, <code><strong>ondurationchange</strong></code>, <code><strong>onemptied</strong></code>, <code><strong>onended</strong></code>, <code><strong>onerror</strong></code>, <code><strong>onfocus</strong></code>, <code><strong>oninput</strong></code>, <code><strong>oninvalid</strong></code>, <code><strong>onkeydown</strong></code>, <code><strong>onkeypress</strong></code>, <code><strong>onkeyup</strong></code>, <code><strong>onload</strong></code>, <code><strong>onloadeddata</strong></code>, <code><strong>onloadedmetadata</strong></code>, <code><strong>onloadstart</strong></code>, <code><strong>onmousedown</strong></code>, <code><strong>onmouseenter</strong></code>, <code><strong>onmouseleave</strong></code>, <code><strong>onmousemove</strong></code>, <code><strong>onmouseout</strong></code>, <code><strong>onmouseover</strong></code>, <code><strong>onmouseup</strong></code>, <code><strong>onmousewheel</strong></code>, <code><strong>onpause</strong></code>, <code><strong>onplay</strong></code>, <code><strong>onplaying</strong></code>, <code><strong>onprogress</strong></code>, <code><strong>onratechange</strong></code>, <code><strong>onreset</strong></code>, <code><strong>onresize</strong></code>, <code><strong>onscroll</strong></code>, <code><strong>onseeked</strong></code>, <code><strong>onseeking</strong></code>, <code><strong>onselect</strong></code>, <code><strong>onshow</strong></code>, <code><strong>onsort</strong></code>, <code><strong>onstalled</strong></code>, <code><strong>onsubmit</strong></code>, <code><strong>onsuspend</strong></code>, <code><strong>ontimeupdate</strong></code>, <code><strong>ontoggle</strong></code>, <code><strong>onvolumechange</strong></code>, <code><strong>onwaiting</strong></code>.</li>
</ul>

<h2 id="全局属性列表">全局属性列表<span class="hidden"> </span><span class="hidden"> </span></h2>

<ul>
</ul>

<dl>
 <dt><a href="/zh-CN/docs/Web/HTML/Global_attributes/accesskey">{{htmlattrdef("accesskey")}}</a></dt>
 <dd>提供了为当前元素生成键盘快捷键的提示。这个属性由空格分隔的字符列表组成。浏览器应该使用在计算机键盘布局上存在的第一个。</dd>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/autocapitalize">{{htmlattrdef("autocapitalize")}}</a></dt>
 <dd>控制用户的文本输入是否和如何自动大写，它可以有以下的值：
 <ul>
  <li><code>off</code> or <code>none</code>，没有应用自动大写（所有字母都默认为小写字母）。</li>
  <li><code>on</code> or <code>sentences</code>，每个句子的第一个字母默认为大写字母;所有其他字母都默认为小写字母。</li>
  <li><code>words</code>，每个单词的第一个字母默认为大写字母;所有其他字母都默认为小写字母。</li>
  <li><code>characters</code>，所有的字母都应该默认为大写。</li>
 </ul>
 </dd>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/class">{{htmlattrdef("class")}}</a></dt>
 <dd>一个以空格分隔的元素的类名（classes ）列表，它允许 CSS 和 Javascript 通过类选择器 (<a href="https://developer.mozilla.org/zh-CN/docs/Web/CSS/Class_selectors">class selectors</a>) 或DOM方法( <a href="https://developer.mozilla.org/zh-CN/docs/Web/API/Document/getElementsByClassName" title="返回一个包含了所有指定类名的子元素的类数组对象。当在document对象上调用时，会搜索整个DOM文档，包含根节点。你也可以在任意元素上调用getElementsByClassName() 方法，它将返回的是以当前元素为根节点，所有指定类名的子元素。"><code>document.getElementsByClassName</code></a>)来选择和访问特定的元素。</dd>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/contenteditable">{{htmlattrdef("contenteditable")}}</a></dt>
 <dd>一个枚举属性（enumerated attribute），表示元素是否可被用户编辑。 如果可以，浏览器会调整元素的部件（widget）以允许编辑。
 <ul>
  <li><code>true</code> 或者空字符串，表明元素是可被编辑的；</li>
  <li><code>false</code>，表明元素不能被编辑。</li>
 </ul>
 </dd>
 <dt><a href="/zh-CN/docs/Web/HTML/Global_attributes/contextmenu">{{htmlattrdef("contextmenu")}}</a></dt>
 <dd>{{HTMLElement("menu")}} 的<code><a href="#attr-id"><strong>id</strong></a></code> ，作为该元素的上下文菜单（已经不被支持，将从所有浏览器中删除）。</dd>
 <dt><a href="/zh-CN/docs/Web/HTML/Global_attributes/data-*">{{htmlattrdef("data-*")}}</a></dt>
 <dd>一类自定义数据属性，它赋予我们在所有 HTML 元素上嵌入自定义数据属性的能力，并可以通过脚本(一般指JavaScript) 与 <a href="https://developer.mozilla.org/zh-CN/docs/Web/HTML" title="zh/HTML">HTML</a> 之间进行专有数据的交换。所有这些自定义数据属性都可以通过所属元素的 <a href="https://developer.mozilla.org/zh-CN/docs/Web/API/HTMLElement" title="HTMLElement 接口表示所有的 HTML 元素。一些HTML元素直接实现了HTMLElement接口，其它的间接实现HTMLElement接口."><code>HTMLElement</code></a> 接口来访问。  <a href="https://developer.mozilla.org/zh-CN/docs/Web/API/HTMLElement/dataset" title="HTMLElement.dataset属性允许无论是在读取模式和写入模式下访问在 HTML或 DOM中的元素上设置的所有自定义数据属性(data-*)集。"><code>HTMLElement.dataset</code></a> 属性可以访问它们。</dd>
 <dt><a href="/zh-CN/docs/Web/HTML/Global_attributes/dir">{{htmlattrdef("dir")}}</a></dt>
 <dd>
 <p>一个指示元素中文本方向的枚举属性。它的取值如下：</p>

 <ul>
  <li>ltr, 指从<em>左</em>到<em>右</em>，用于那种从左向右书写的语言（比如英语）；</li>
  <li>rtl, 指从<em>右</em>到<em>左</em>，用于那种从右向左书写的语言（比如阿拉伯语）；</li>
  <li>auto, 指由用户代理决定方向。它在解析元素中字符时会运用一个基本算法，直到发现一个具有强方向性的字符，然后将这一方向应用于整个元素。</li>
 </ul>
 </dd>
 <dt><a href="/zh-CN/docs/Web/HTML/Global_attributes/draggable">{{htmlattrdef("draggable")}}</a></dt>
 <dd>一种枚举属性，指示是否可以 使用 <a href="/zh-CN/docs/DragDrop/Drag_and_Drop">Drag and Drop API</a> 拖动元素。它可以有以下的值：
 <ul>
  <li><code>true</code>, 这表明元素可能被拖动</li>
  <li><code>false</code>, 这表明元素可能不会被拖动</li>
 </ul>
 </dd>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/dropzone">{{htmlattrdef("dropzone")}}</a> {{experimental_inline}}</dt>
 <dd>枚举属性，指示可以使用 <a href="https://developer.mozilla.org/en-US/docs/DragDrop/Drag_and_Drop">Drag and Drop API</a> 在元素上删除哪些类型的内容。 它可以具有以下值：
 <ul>
  <li>copy，表示drop将创建被拖动元素的副本</li>
  <li>move，表示拖动的元素将移动到此新位置。</li>
  <li><code>link</code>，将创建一个指向拖动数据的链接。</li>
 </ul>
 </dd>
 <dt><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/exportparts">{{HTMLAttrDef("exportparts")}}</a> {{Experimental_Inline}}</dt>
 <dd>Used to transitively export shadow parts from a nested shadow tree into a containing light tree.</dd>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/hidden">{{htmlattrdef("hidden")}}</a></dt>
 <dd><font><font>布尔属性表示该元素尚未或不再</font></font><em><font><font>相关</font></font></em><font><font>。</font><font>例如，它可用于隐藏在登录过程完成之前无法使用的页面元素。</font><font>浏览器不会呈现此类元素。</font><font>不得使用此属性隐藏可合法显示的内容</font></font></dd>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/id">{{htmlattrdef("id")}}</a></dt>
 <dd>定义唯一标识符（ID），该标识符在整个文档中必须是唯一的。 其目的是在链接（使用片段标识符），脚本或样式（使用CSS）时标识元素。</dd>
 <dt><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode">{{HTMLAttrDef("inputmode")}}</a></dt>
 <dd>向浏览器提供有关在编辑此元素或其内容时要使用的虚拟键盘配置类型的提示。主要用于 {{HTMLElement("input")}}元素，但在{{HTMLAttrxRef("contenteditable")}}模式下可用于任何元素。</dd>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/is">{{htmlattrdef("is")}}</a></dt>
 <dd>允许您指定标准HTML元素应该像已注册的自定义内置元素一样（有关更多详细信息，请参阅使用自定义元素）。</dd>
</dl>

<div class="note">
<p><strong>注意: </strong>item *属性是 <a class="external" href="https://html.spec.whatwg.org/multipage/microdata.html#microdata">WHATWG HTML Microdata feature</a>的一部分。</p>
</div>

<dl>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/itemid">{{htmlattrdef("itemid")}}</a></dt>
 <dd>项的唯一全局标识符。</dd>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/itemprop">{{htmlattrdef("itemprop")}}</a></dt>
 <dd>用于向项添加属性。 每个HTML元素都可以指定一个itemprop属性，其中一个itemprop由一个名称和值对组成。</dd>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/itemref">{{htmlattrdef("itemref")}}</a></dt>
 <dd>只有不是具有<code>itemscope</code>属性的元素的后代，它的属性才可以与使用<code>itemref</code>项目相关联。它提供了元素ID列表（而不是<code>itemids</code>）以及文档中其他位置的其他属性。</dd>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/itemscope">{{htmlattrdef("itemscope")}}</a></dt>
 <dd><code>itemscope</code>（通常）与{{htmlattrxref("itemtype")}}一起使用，以指定包含在关于特定项目代码块中的HTML。 <code>itemscope</code>创建Item并定义与之关联的<code>itemtype</code>的范围。 <code>itemtype</code>是描述项及其属性上下文的词汇表（例如<a class="external external-icon" href="https://schema.org/">schema.org</a>）的有效URL。</dd>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/itemtype">{{htmlattrdef("itemtype")}}</a></dt>
 <dd>指定将用于在数据结构中定义<code>itemprops</code>（项属性）的词汇表的URL。 <code><a href="/en-US/docs/Web/HTML/Global_attributes/itemscope">itemscope</a></code>用于设置数据结构中按<code>itemtype</code>设置的词汇表的生效范围。</dd>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/lang">{{htmlattrdef("lang")}}</a></dt>
 <dd>帮助定义元素的语言:不可编辑元素所在的语言，或者应该由用户编写的可编辑元素的语言。该属性包含一个“语言标记”(由用连字符分隔的“语言子标记”组成)，格式在 <a href="https://www.ietf.org/rfc/bcp/bcp47.txt"><em>Tags for Identifying Languages (BCP47)</em></a> 中定义。<strong><a href="https://developer.mozilla.org/zh-CN/docs/Web/HTML/Global_attributes$edit#attr-xml:lang">xml:lang</a> </strong>优先于它。</dd>
 <dt></dt>
 <dt><a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/part">{{HTMLAttrDef("part")}}</a> {{Experimental_Inline}}</dt>
 <dd>元素的部件名称的空格分隔列表。Part名称允许CSS通过{{CSSxRef("::part()")}} 伪元素选择和设置阴影关联树中的特定元素。</dd>
</dl>

<dl>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/slot">{{htmlattrdef("slot")}}</a></dt>
 <dd>将<a href="/en-US/docs/Web/Web_Components/Shadow_DOM">shadow DOM</a>阴影关联树中的一个沟槽分配给一个元素：具有<code>slot</code>属性的元素被分配给由{{HTMLElement("slot")}}元素创建的沟槽，其{{htmlattrxref("name", "slot")}}属性的值与<code>slot</code>属性的值匹配。</dd>
</dl>

<dl>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/spellcheck">{{htmlattrdef("spellcheck")}}</a> {{experimental_inline}}</dt>
 <dd>枚举属性定义是否可以检查元素是否存在拼写错误。它可能具有以下值：
 <ul>
  <li><code>true</code>，表示如果可能，应检查元素是否存在拼写错误;</li>
  <li><code>false</code>, 表示不应检查元素的拼写错误。</li>
 </ul>
 </dd>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/style">{{htmlattrdef("style")}}</a></dt>
 <dd>含要应用于元素的<a href="/en-US/docs/Web/CSS">CSS</a>样式声明。 请注意，建议在单独的文件中定义样式。 该属性和{{HTMLElement("style")}}元素主要用于快速样式化，例如用于测试目的。</dd>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/tabindex">{{htmlattrdef("tabindex")}}</a></dt>
 <dd>整数属性，指示元素是否可以获取输入焦点（可聚焦），是否应该参与顺序键盘导航，如果是，则表示哪个位置。它可能需要几个值：
 <ul>
  <li>负值表示该元素应该是可聚焦的，但不应通过顺序键盘导航到达;</li>
  <li><code>0</code> 表示元素应通过顺序键盘导航可聚焦和可到达，但其相对顺序由平台约定定义;</li>
  <li>正值意味着元素应该可以通过顺序键盘导航进行聚焦和访问;元素聚焦的顺序是<a href="#attr-tabindex"><strong>tabindex</strong></a>的增加值。如果多个元素共享相同的<code>tabindex</code>，则它们的相对顺序遵循它们在文档中的相对位置。</li>
 </ul>
 </dd>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/title">{{htmlattrdef("title")}}</a></dt>
 <dd>包含表示与其所属元素相关信息的文本。 这些信息通常可以作为提示呈现给用户,但不是必须的。</dd>
 <dt><a href="/en-US/docs/Web/HTML/Global_attributes/translate">{{htmlattrdef("translate")}}</a> {{experimental_inline}}</dt>
 <dd>枚举属性，用于指定在页面本地化时是否转换元素的属性值及其{{domxref("Text")}} 节点子节点的值，或者是否保持它们不变。它可以具有以下值：
 <ul>
  <li>空字符串和<code>"yes"</code>，表示元素将被翻译。</li>
  <li><code>"no"</code>, 表示该元素不会被翻译。</li>
 </ul>
 </dd>
</dl>

<h2 id="规范">规范</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">规范</th>
   <th scope="col">状态</th>
   <th scope="col">注释</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{SpecName('HTML WHATWG', "dom.html#global-attributes", "Global attributes")}}</td>
   <td>{{Spec2('HTML WHATWG')}}</td>
   <td>From latest snapshot, {{SpecName('HTML5.1')}}, <code>itemid</code>, <code>itemprop</code>, <code>itemref</code>, <code>itemscope</code>, and <code>itemtype</code> have been added.</td>
  </tr>
  <tr>
   <td>{{SpecName('HTML5.1', "dom.html#global-attributes", "Global attributes")}}</td>
   <td>{{Spec2('HTML5.1')}}</td>
   <td>Snapshot of {{SpecName('HTML WHATWG')}}. From {{SpecName('HTML5 W3C')}}, <code>spellcheck</code>, <code>draggable</code>, and <code>dropzone</code> have been added.</td>
  </tr>
  <tr>
   <td>{{SpecName('HTML5 W3C', "dom.html#global-attributes", "Global attributes")}}</td>
   <td>{{Spec2('HTML5 W3C')}}</td>
   <td>Snapshot of {{SpecName('HTML WHATWG')}}. From {{SpecName("HTML4.01")}}, the concept of global attributes is introduced and the <code>dir</code>, <code>lang</code>, <code>style</code>, <code>id</code>, <code>class</code>, <code>tabindex</code>, <code>accesskey</code>, and <code>title</code> are now true global attributes.<br>
    <code>xml:lang</code> which was initially part of XHTML, is now also part of HTML.<br>
    <code>hidden</code>, <code>data-*</code>, <code>contextmenu</code>, <code>contenteditable</code>, and <code>translate</code> have been added.</td>
  </tr>
  <tr>
   <td>{{SpecName('HTML4.01')}}</td>
   <td>{{Spec2('HTML4.01')}}</td>
   <td>There are no global attributes defined. Several attributes that will become global attributes in subsequent specifications are defined on a subset of elements.<br>
    <code>class</code> and <code>style</code> are supported on all elements but {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}}, and {{HTMLElement("title")}}.<br>
    <code>dir</code> is supported on all elements but {{HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("bdo")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}}, and {{HTMLElement("script")}}.<br>
    <code>id</code> is supported on all elements but {{HTMLElement("base")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("script")}}, {{HTMLElement("style")}}, and {{HTMLElement("title")}}.<br>
    <code>lang</code> is supported on all elements but {{HTMLElement("applet")}}, {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("br")}}, {{HTMLElement("frame")}}, {{HTMLElement("frameset")}}, {{HTMLElement("iframe")}}, {{HTMLElement("param")}}, and {{HTMLElement("script")}}.<br>
    <code>tabindex</code> is only supported on {{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("button")}}, {{HTMLElement("object")}}, {{HTMLElement("select")}}, and {{HTMLElement("textarea")}}.<br>
    <code>accesskey</code> is only supported on {{HTMLElement("a")}}, {{HTMLElement("area")}}, {{HTMLElement("button")}}, {{HTMLElement("input")}}, {{HTMLElement("label")}}, {{HTMLElement("legend")}} and {{HTMLElement("textarea")}}.<br>
    <code>title</code> is supported on all elements but {{HTMLElement("base")}}, {{HTMLElement("basefont")}}, {{HTMLElement("head")}}, {{HTMLElement("html")}}, {{HTMLElement("meta")}}, {{HTMLElement("param")}}, {{HTMLElement("script")}}, and {{HTMLElement("title")}}.</td>
  </tr>
 </tbody>
</table>

<h2 id="浏览器兼容性">浏览器兼容性</h2>



<p>{{Compat("html.global_attributes")}}</p>

<h2 id="参见">参见</h2>

<ul>
 <li>{{domxref("Element")}} 和 {{domxref("GlobalEventHandlers")}} 接口允许查询大多数全局属性。</li>
</ul>