HTML 中 'hidden' 和 'aria-hidden' 属性的区别

HTML - 超文本标记语言 是一种预设的网页设计语言。当与 CSS - 层叠样式表 和 JS - JavaScript 等其他编程语言结合使用时，我们可以创建许多动态 Web 应用程序来解决日常问题。

除了上述技术外，HTML 还利用了 ARIA - 可访问的富互联网应用程序等技术，这有助于开发人员为具有特定能力的人创建友好的 Web 内容。

巨大的优势也伴随着某些缺点。首先，HTML 和 ARIA 都包含一些相似的关键字，这在初学者中造成了巨大的困惑。例如，hidden 关键字同时存在于 HTML 和 ARIA 中。

HTML hidden 属性

HTML hidden 属性专门用于在满足某些条件或标准之前不向用户显示的元素，即内容与特定用户无关的元素。

例如，如果我们使用 hidden 属性，浏览器将不会显示元素的内容，但使用某些 JavaScript 操作，我们可以轻松访问 hidden 属性，当用户满足某些条件时，JavaScript 将允许浏览器显示 hidden 属性的内容。

语法

<元素 hidden>

示例

展示 hidden 属性用法的程序

输出

通过 JavaScript 访问元素来展示 hidden 属性用法的程序

输出

Aria hidden 属性

Aria hidden 属性向用户指示他们正在阅读的内容的重要性，内容是应该被关注还是被忽略。它指示元素及其子元素不会像程序员定义的那样对客户端可见或可访问。

在 aria-hidden 中，元素不会从浏览器中移除；相反，它会从可访问性树和辅助技术中移除，但内容仍然显示在浏览器上。例如，aria-hidden = " true " 只会从可访问性树中移除所需的元素和子元素。它只能用于特定元素，如果与 body 等绑定元素一起使用，则整个网页将变得不可访问。

语法

<元素 aria-hidden="true/false">

示例

展示 aria hidden 属性的程序

输出

注意：aria-hidden 表示元素及其所有子元素都不可见于开发人员所实现的任何用户。

HTML hidden 和 aria-hidden 的区别