我听说.hidden不要把这门课当成
.hidden { display: none }
但将其宽度和高度设为 1，并使用剪裁等方式使元素就好像它仍然存在于屏幕上一样，但内容只是不可见。
但是，当我们使用 JavaScript 隐藏某些东西时，该元素的用途就完成了，我们不希望它显示在屏幕上并且对屏幕阅读器不可见，这难道不是真的吗？
情况一：比如是一个输入框，输入框里面有一行灰色的文字“输入关键字”。当用户实际单击或按下键（或使用input事件）时，现在我们有一个 JavaScript 处理程序来隐藏“输入关键字”文本，因为它只是输入框中的灰色提示。在这种情况下，不应该完全隐藏文本，实际上使用 a display: none，以便即使屏幕阅读器也无法阅读它？（用户已经学会了开始打字的足够多的知识，所以屏幕阅读器不应该真的还在那里阅读提示，对吗？）
情况二：如果是弹出气泡，错误提示，或者有“请输入您的邮箱订阅我们”的链接，会弹出一个气泡，那么当气泡关闭时，应该不是气泡真的完全关闭使用display: none？屏幕阅读器不应该仍然能够为已完成并关闭的气泡读取这些内容。
情况 3：我能想到的唯一情况是屏幕阅读器应该可以使用“隐藏”的一小部分是：它用于提供额外信息的气泡，例如产品评级（5 颗星中有多少颗星） )，或者当鼠标悬停在某个“？”上时可以弹出的额外帮助信息。图标或链接。但即使在这种情况下，不会屏幕阅读器实际宣读“链接的详细信息”或“链接显示等级”，即在alt或title标签，而不是阅读弹出信息，直到用户弹出它开放?
所以我的问题是：不应该真的有两种类型的隐藏。一种是display: none屏幕阅读器不应该看到的类型（将其设为.hidden类），另一种width: 1px; height; 1px是屏幕阅读器可以看到（或将读出）（将其.a11y-hidden设为类），以及类型 2 的频率是否远低于类型 1？