HTML hidden="until-found" 搜索可见与内容发现实践

HTML hidden="until-found" 搜索可见与内容发现实践概述`hidden="until-found"` 使元素在默认隐藏时仍可被“页面查找”或片段导航定位，并在命中后自动显现并滚动到视图。核心概念与参数状态：Hidden vs Hidden Until Found（可被查找触发显现）。`beforematch` 事件：在显现前触发，适合更新内容或移除遮挡。与 `content-visibility` 协作：浏览器通常用其实现隐藏状态。实践示例<section id="faq" hidden="until-found">... <!-- 命中时触发 beforematch 显现并滚动到内容 --> </section> <script> document.getElementById('faq')?.addEventListener('beforematch', () => { // 更新提示或移除懒加载遮挡 }); </script> 验证方法规范与支持：参考 MDN（hidden 及 until-found）、HTML Standard 与 `beforematch` 事件文档。兼容性：旧浏览器退化为 `display: none` 行为，确保样式不破坏显现逻辑。注意事项元素需具备布局包含（避免 `display: none` 导致无法显现）。与目录/片段导航协作时确保 ID 唯一与锚点正确。与长列表优化结合时评估显现时的滚动与布局稳定性。参考：MDN（hidden until-found、beforematch）、HTML Standard。