XHTML 属性

2025 年 2 月 14 日 | 6 分钟阅读

有一些 XHTML 属性是标准的,并且与所有 XHTML 标签相关联。 XHTML 属性可以分为 3 种类型

  • 核心属性
  • 语言属性
  • Microsoft 专有属性

核心属性

核心属性在 base、head、html、meta、param、script、style 和 title 元素中无效。

核心属性应用于 XHTML 中的大多数元素,以向元素添加功能或提供对元素显示方式的更多控制。 这些属性不适用于某些元素 - base、head、html、meta、param、script、style 和 title。

属性描述
classclass_rule 或 style_rule它指定元素的类。
idid_name它指定元素的唯一 ID。
stylestyle_definition它指定内联样式定义。
titletooltip_text它指定要在鼠标提示中显示的文本。
  1. class: class 属性使元素可以与指定的类相关联。然后,可以使用该元素同时将 CSS 样式或 JavaScript 应用于多个元素,而无需为每个元素重复代码。 正如所有属性一样,此属性采用名称形式的值,稍后可以通过引用其类名将样式或行为应用于多个元素。
  2. id: id 属性为元素提供一个唯一的标识符,以便在脚本和样式中选择性地唯一地选择或操作它。 当通过 CSS 或 JavaScript 定位任何特定元素时,这非常方便,因为它提供了对其外观和行为的最大控制。
  3. style: style 属性将保存元素的内联 CSS 样式,从而将特定样式直接应用于标签中。这对于应用快速的、特定于元素的样式而无需参考外部或内部 CSS 很有用。
  4. title: title 属性为元素提供额外的解释,通常显示为此悬停工具提示。 这可用于向用户传达有关特定元素的附加信息或说明。

语言属性

lang 属性指定用于封闭内容的语言。 它使用 ISO 标准语言缩写,例如 fr 表示法语,en 表示英语,等等。 语言属性在 base、br、frame、frameset、hr、iframe、param 和 script 元素中无效。

语言属性对于定义 XHTML 元素任何内容中的文本的语言和方向当然非常重要。 这些属性可以正确呈现和解释文本,尤其是在多语言 Web 应用程序中。 语言属性在元素 base、br、frame、frameset、hr、iframe、param 和 script 中无效。

属性描述
dirltr | rtl它用于设置文本方向。
langlanguage_code它用于设置语言代码。
  1. dir: dir 属性允许设置内容的文本方向,可能的值为 ltr 或 rtl。 对于像阿拉伯语和希伯来语这样从右到左阅读的语言,正确设置此属性非常重要。
  2. lang: lang 属性指定元素中的内容使用的语言,并使用 ISO 格式的标准缩写,例如 en 表示英语或 fr 表示法语。 这对于搜索引擎和浏览器了解文本是用什么语言编写的非常重要,以增强可访问性和搜索引擎优化。

Microsoft 专有属性

Microsoft 推出了一些专有属性,Internet Explorer 4 及更高版本均支持。

属性描述
accesskey字符它用于设置用于访问元素的键盘快捷键。
languageString此属性指定与绑定到元素的脚本一起使用的脚本语言,通常通过事件处理程序属性。 它的可能值可能包括 JavaScript、jScript、VBS 和 VBScript。
tabindex数字它用于设置元素的制表符顺序。
contenteditableBoolean它允许用户编辑在 Internet Explorer 5.5 或更高版本中呈现的内容。它的可能值为 true 或 false。
disabledBooleandisabled 属性使元素看起来褪色,并且不会响应用户输入。它的可能值为 true 或 false。
hidefocusOn 或 Off此专有属性,由 Internet Explorer 5.5 引入,隐藏元素内容上的焦点。它指定必须使用 tabindex 属性将焦点应用于元素。
unselectableOn 或 Off它用于防止在 Internet Explorer 5.5 中显示的内容被选中。

全局属性

全局属性增加了 XHTML 元素的灵活性,使其更易于使用和通用。

  1. data: 允许作者直接在页面或应用程序中分配私有数据。 通过使用 data-* 属性,可以使用脚本语言(如 JavaScript)访问私有数据。
  2. hidden: 表明该元素尚未或不应与用户交互。 浏览器不显示此类元素。
  3. draggable: 指示该元素是可移动的。 主要用于我们在 Web 应用程序中使用的拖放功能。
  4. spellcheck: 此属性指定是否应检查用户输入是否存在拼写和语法错误。 事实证明,这对于一个人可能希望拼写准确的输入字段特别有帮助。

事件属性

XHTML 中的事件属性旨在控制用户或特定脚本创建的事件。 将这些属性合并到 HTML 元素中以定义在发生特定事件时执行的 JavaScript 代码集合更容易。 事件属性通常允许动态交互和行为,这意味着它可用于提供各种响应式和交互式 Web 应用程序。

常见事件属性

  1. onclick: 当用户单击某个元素时执行 JavaScript。 最常见的是,它用于启动表单提交、用户的导航或通过鼠标单击激活元素的交互行为。
  2. ondblclick: 当一个元素被双击时执行 JavaScript。 当您想要设置一些双击功能以打开详细视图或触发某种类型的编辑模式时,这非常有用。
  3. onmousedown: 用于在单击并保持在元素上时触发 JavaScript。 它用于触发需要通过单击并按住交互完成的操作。
  4. onmousemove: JavaScript 用于在鼠标光标移动到元素上时触发; 它对于保持工具提示的更新位置或在鼠标在页面上移动时发送事件时突出显示内容的某些区域很有用。
  5. onmouseout: 定义当鼠标指针移出元素时应运行的 JavaScript 代码。 例如,我们经常使用它来回滚由于 onmouseover 事件所做的更改,例如隐藏工具提示或删除高亮显示。 onmouseover: 当鼠标指针悬停在元素上时运行的事件。 通常,它用于更改按钮的外观或添加更多细节,称为悬停效果。
  6. onmouseup: 当鼠标按钮在一个元素上被释放时,此处的 JavaScript 会生效,并可用于完成在 onmousedown 中启动的操作,例如在拖放界面中放下物品。

ARIA(无障碍富互联网应用程序)属性

ARIA 属性使用 HTML、JavaScript 和相关技术丰富具有信息的动态和用户界面组件。 它们为 Web 应用程序中存在的元素赋予辅助技术的意义。

  1. aria-label: 一种用于标记的可访问方式,允许通过屏幕阅读器访问此元素。 在最重要的用途中,它让用户知道元素的目的,当它没有伴随的可见标签时。
  2. aria-hidden: 它声明该元素是否被覆盖或从用户的视野中剪裁。 该属性有助于辅助技术(如屏幕阅读器,尤其是屏幕阅读器)避免宣布与页面无关的元素,从而提高其可访问性。
  3. aria-live: 它指示如何在实时区域内宣布更新。 它使屏幕阅读器能够对动态内容的更改做出正确的声明; 它可以是聊天内容、通知或任何其他更改的任何更改,以使用户及时了解关键信息更改。

角色属性

角色属性使用与可访问性相关的语义信息来丰富元素,并有助于指定元素在网页上下文中的角色; 辅助技术通常需要此类信息来弄清 Web 内容的结构,以便其目的也对用户(尤其是残疾用户)清晰。

  • ROLE: 它是元素功能的表示。 例如,导航、主要、横幅、补充。 角色属性帮助开发人员识别网页不同部分的功能,以便轻松地使屏幕阅读器或辅助技术对内容有很好的理解。

下一个主题XHTML 面试题