URL 中的 `#:~:text=` 如何突出显示文本？
How does `#:~:text=` in URL works to highlight text?
TL;DR
How/why 是否有一些浏览器能够搜索和突出显示 HTML 正文中紧跟 URL 中的 #:~:text= 的文本？
说明
有一天我在搜索something on Google, which lead me to Quora's result. I observed that 2 sentences were highlighted in yellow, which were part of URL after the aforementioned parameter. I thought this would be Quora's feature for SEO or something, however, also found this on Linkedin, and Medium，等等。
我想知道：
- 这个突出显示叫什么？ Why/how 有用吗？
- 这似乎是特定于浏览器的。哪些种类的浏览器支持此功能？
它似乎适用于 Chrome 和 Edge；但不适用于 Firefox、Safari 和 IE。
- 前端程序员是否需要在代码中加入一些东西才能让搜索引擎突出显示其网页上的内容？ （基于搜索引擎实际上附加了用户查询预测的相关字符串的假设）
高亮叫Text Fragments。它是最近添加到 Chrome 80 的一项新功能。它通过在 URL 哈希中指定一个文本片段来工作。
是的，它是特定于浏览器的。
不，当您从 Google 的搜索结果中点击 link 时获得的体验是算法确定的精选片段的一部分。您无法将任何内容合并到您的代码中来提示搜索引擎突出显示您网页上的文本。
There is no markup needed by webmasters. This happens automatically,
using Scroll To Text for HTML pages
https://chromestatus.com/feature/4733392803332096. See also more
background here: https://support.google.com/webmasters/answer/6229325
来源：
- https://web.dev/text-fragments/
- https://www.theverge.com/2020/6/4/21280115/google-search-engine-yellow-highlight-featured-snippet-anchor-text
- https://www.theverge.com/2020/6/18/21295300/google-link-to-text-fragment-chrome-extension-chromium-highlight-scroll-down
- https://searchengineland.com/google-launches-featured-snippet-to-web-page-content-highlight-feature-335511
- https://blog.chromium.org/2019/12/chrome-80-content-indexing-es-modules.html
虽然文本片段仅在最新 Google Chrome（以及最新版本的基于 Chromium 的浏览器，例如新的 Microsoft Edge）中本地实现，但有一个浏览器 extension/add-on 似乎在 Firefox 和 Safari 上启用它：https://github.com/GoogleChromeLabs/link-to-text-fragment
似乎使用了#ref-for-fragment-directive:~:text= 和附加参数（而不只是简单的 #:~:text=）。
- 火狐：https://addons.mozilla.org/firefox/addon/link-to-text-fragment/
- 野生动物园：https://apps.apple.com/app/link-to-text-fragment/id1532224396
奇怪的是，扩展也可用于 Chrome 和 Edge（！）。
.
更新：我正在 Firefox Developer Edition 上测试它，但它对我不起作用。
TL;DR
How/why 是否有一些浏览器能够搜索和突出显示 HTML 正文中紧跟 URL 中的 #:~:text= 的文本？
说明
有一天我在搜索something on Google, which lead me to Quora's result. I observed that 2 sentences were highlighted in yellow, which were part of URL after the aforementioned parameter. I thought this would be Quora's feature for SEO or something, however, also found this on Linkedin, and Medium，等等。
我想知道：
- 这个突出显示叫什么？ Why/how 有用吗？
- 这似乎是特定于浏览器的。哪些种类的浏览器支持此功能？
它似乎适用于 Chrome 和 Edge；但不适用于 Firefox、Safari 和 IE。 - 前端程序员是否需要在代码中加入一些东西才能让搜索引擎突出显示其网页上的内容？ （基于搜索引擎实际上附加了用户查询预测的相关字符串的假设）
高亮叫Text Fragments。它是最近添加到 Chrome 80 的一项新功能。它通过在 URL 哈希中指定一个文本片段来工作。
是的，它是特定于浏览器的。
不，当您从 Google 的搜索结果中点击 link 时获得的体验是算法确定的精选片段的一部分。您无法将任何内容合并到您的代码中来提示搜索引擎突出显示您网页上的文本。
There is no markup needed by webmasters. This happens automatically, using Scroll To Text for HTML pages https://chromestatus.com/feature/4733392803332096. See also more background here: https://support.google.com/webmasters/answer/6229325
来源：
- https://web.dev/text-fragments/
- https://www.theverge.com/2020/6/4/21280115/google-search-engine-yellow-highlight-featured-snippet-anchor-text
- https://www.theverge.com/2020/6/18/21295300/google-link-to-text-fragment-chrome-extension-chromium-highlight-scroll-down
- https://searchengineland.com/google-launches-featured-snippet-to-web-page-content-highlight-feature-335511
- https://blog.chromium.org/2019/12/chrome-80-content-indexing-es-modules.html
虽然文本片段仅在最新 Google Chrome（以及最新版本的基于 Chromium 的浏览器，例如新的 Microsoft Edge）中本地实现，但有一个浏览器 extension/add-on 似乎在 Firefox 和 Safari 上启用它：https://github.com/GoogleChromeLabs/link-to-text-fragment
似乎使用了#ref-for-fragment-directive:~:text= 和附加参数（而不只是简单的 #:~:text=）。
- 火狐：https://addons.mozilla.org/firefox/addon/link-to-text-fragment/
- 野生动物园：https://apps.apple.com/app/link-to-text-fragment/id1532224396
奇怪的是，扩展也可用于 Chrome 和 Edge（！）。
.
更新：我正在 Firefox Developer Edition 上测试它，但它对我不起作用。