收起内容部分（有时称为“手风琴式折叠”）是一种常见的界面模式。不过，您无法使用页内查找功能搜索收起的部分中隐藏的内容。此外，系统也无法链接到收起区域内的文本片段。
hidden=until-found HTML 属性和 beforematch 事件可以解决这些问题。通过向隐藏内容的容器添加 hidden=until-found，您可以让浏览器在该隐藏区域中搜索文本，并在找到匹配项时显示该部分。
这些功能从 Chrome 102 开始提供，下面我们来看看它们的运作方式。
使用方法
如果您的网站上已有可收起的部分，并且您希望这些部分可供搜索，请将用于隐藏这些部分的样式替换为 hidden=until-found 属性。如果您的网页还有其他状态需要与您的版块是否显示保持同步，请添加一个 beforematch 事件监听器，该监听器将在浏览器显示 hidden=until-found 元素之前立即对该元素触发。
注意事项
为了提供一致的用户体验，hidden=until-found 内容应在不使用页内搜索的情况下可供显示。并非所有用户都会使用“在网页中查找”功能，不支持 hidden=until-found 的浏览器将获得隐藏内容的原始体验，而不泄露“在网页上查找”功能。
如果您想确保隐藏的内容在不支持 hidden=until-found 的浏览器中可供搜索，可以随时在这些浏览器中展开隐藏的内容。您可以通过检查是否存在 beforematch 事件处理脚本来进行功能检测：
if (!(‘onbeforematch' in document.body)) {
// expand all hidden content
}
hidden=until-found 会应用 content-visibility:hidden CSS 属性，而不是常规“hidden”属性应用的 display:none 属性。这对于在内容处于关闭状态时搜索内容至关重要，但也存在以下副作用：
- 某些布局 API（例如
getBoundingClientRect）会报告hidden=until-found元素中的隐藏内容会占用空间，并且在页面中具有位置。 - 系统不会渲染
hidden=until-found元素的子节点，但hidden=until-found元素本身仍会显示一个框。这意味着边框和显式尺寸等 CSS 属性仍会影响渲染。
例如，以下演示会向应用了 hidden=until-found 的元素添加边距、边框和内边距。隐藏内容将显示在带灰色边框的框中，当隐藏内容显示时，该框会填充相应内容。这是隐藏元素的框。
为避免此问题，请将边框添加到包含 hidden=until-found 的容器中嵌套的元素。