折叠内容部分（有时称为手风琴式折叠）是一种常见的界面模式。但是，隐藏在收起部分中的内容无法使用“在网页中查找”搜索功能进行搜索。此外，也无法链接到收起区域内的文本片段。
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 属性，而不是常规隐藏属性应用的 display:none 属性。如果想在内容关闭时搜索内容，您需要使用此键，但也会带来以下负面影响：
- 某些布局 API（例如
getBoundingClientRect）会报告hidden=until-found元素内的隐藏内容会占用空间并在页面中有位置。 hidden=until-found元素的子节点将不会渲染，但hidden=until-found元素本身仍会有一个框。这意味着边框和明确尺寸等 CSS 属性仍会影响呈现。
例如，以下演示为应用了 hidden=until-found 的元素添加了外边距、边框和内边距。隐藏内容显示的位置是一个带有灰色边框的框，当隐藏内容显示出来后，它会填充其中。这是隐藏元素的方框。
为避免此问题，请为嵌套在包含 hidden=until-found 的容器内的元素添加边框。
主打图片：Thomas Bormans 提供。