React 实现 浏览器自带搜索功能

booer
1,434 阅读1分钟

1.png

浏览器自带的搜索功能主要有几个特点

  • 搜索框

    • 搜索框右侧能显示匹配的文本总数，以及当前匹配到的是第几个文本。
    • 搜索框右侧有上下按钮，并且按钮点击之后能让页面滚动到聚焦的文本位置。

  • 页面匹配文本

    • 匹配到的文本统一用黄色背景显示
    • 当前聚集的文本用 橙色背景显示。

主要功能就是上面四点，根据这四点就能使用 React 开发一个简单的 web 端搜索功能

avatar
文章
阅读
粉丝