search 输入框必须嵌套在 form 标签内才能启用完整功能，否则 Safari 无清空按钮、Android 键盘不显示“搜索”键、回车不提交；form 的 action 和 name 属性必须正确设置，name 推荐为 "q"。
search 输入框必须包在 form 里才可靠
单独写 <input type="search"> 看似能用，但 Safari 不显示清空按钮、Android 键盘不触发“搜索”软键盘、回车不提交——这些都不是 bug，是规范要求。浏览器只在合法 <form> 上下文中启用 search 类型的完整行为。
实操建议：
立即学习“前端免费学习笔记（深入）”；
Article To Html
下载
文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。
-
action属性不能留空或设为"#"，否则会刷新当前页；要跳转百度就填https://www.baidu.com/s，要走自己接口就填真实后端地址（如/api/search） - 务必加
name="q"（或其他语义名），否则提交后 URL 不带参数，后端收不到关键词 - 移动端“搜索”键是否出现，取决于三者同时存在：
<form>+type="search"+name属性
本地静态搜索别硬写 JS 匹配逻辑
如果你的 HTML 模板是纯静态站点（无后端、内容不超过 50 页），直接手写 filter() + includes() 是可行的，但容易卡顿、不支持中文分词、无法高亮、没防抖——用户连打两个字就重刷 DOM，体验差。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 优先用现成工具：Pagefind 编译时生成索引，零运行时开销，支持中文、PDF、Markdown 全文检索，只要执行
pagefind --source public就行 - 如果坚持手写，至少加防抖：用
setTimeout延迟执行，输入停顿 300ms 后再过滤，避免每敲一个字都遍历数组 - 别用
innerHTML = ...map(...)全量重绘结果列表，改用documentFragment或只更新textContent变动项
List.js 适合已有表格/列表结构的快速增强
你不是要从零造轮子，而是给现有 HTML 表格或 <ul> 列表加搜索排序功能，List.js 就是为此设计的——它不改 DOM 结构，只读取 class 或 data 属性做匹配。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 引入 CDN 版本最省事：
<script src="//cdnjs.cloudflare.com/ajax/libs/list.js/2.3.1/list.min.js"></script> - 关键配置是
valueNames：对应 HTML 中的 class 名，比如<td class="title">安装指南</td>就写['title']，别写成['.title'] - 模糊搜索需额外加载插件：
<script src="//cdnjs.cloudflare.com/ajax/libs/list.js/2.3.1/list.fuzzysearch.min.js"></script>，否则默认只做精确子串匹配 - 不支持嵌套结构（如表格内含
<div>再包文字），数据必须扁平落在指定 class 元素的文本节点里
用百度站内搜索前先确认备案和爬虫权限
百度站内搜索看似“粘贴代码就完事”，但实际生效依赖两个隐藏前提：你的域名已完成百度站长平台验证，且百度蜘蛛能正常抓取页面。否则搜索框能显示，但点进去全是“未收录”或空结果。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 验证必须用 HTML 标签方式（把百度给的
<meta>放进<head>），DNS 或文件验证对站内搜索无效 - 搜索范围选“所有”后，等 3–7 天，去百度搜索
site:yourdomain.com看是否真有收录，没收录就别急着嵌入搜索框 - 结果页 logo 和品牌词强化需网站已通过 ICP 备案，个人未备案站点即使装了代码，结果页仍显示“百度提供”水印
