DataTables 是实现表格搜索的首选插件，需正确引入 jQuery 和 DataTables 文件（含 Bootstrap 适配版），配置 searching: true、dom: 'rt' 及 language.search 自定义提示；默认区分大小写且中文需完整匹配，应设 search: { caseInsensitive: true } 并确保 UTF-8 编码；禁用搜索推荐初始化设 searching: false，服务端模式下前端配置仅控制搜索框显隐。
用 DataTables 插件实现表格搜索，不是 Bootstrap 自带功能
bootstrap 本身不提供表格搜索过滤能力，table 只是样式容器。真要加搜索，得靠第三方插件，最常用、最稳的是 datatables。它和 bootstrap 的 css 兼容性好，开箱即用，别想着自己手写过滤逻辑——容易漏空格、大小写、中文分词，还影响性能。
常见错误现象：$(‘#myTable’).DataTable() 报错 “DataTable is not a function”，多半是没引入 JS 文件，或引入顺序错了（jQuery 必须在 DataTables 前）。
- 必须先加载
jQuery，再加载DataTablesJS（jquery.dataTables.min.js）和 CSS（jquery.dataTables.min.css） - 如果用 Bootstrap 5，额外加
dataTables.bootstrap5.min.css和dataTables.bootstrap5.min.js，否则搜索框样式错位 -
table必须有id，且初始化时传入选择器，比如$('#user-table')，不能只用 class
初始化时开启搜索并控制搜索框位置
默认搜索框会出现在表格上方右侧，但经常被误以为“没生效”——其实它藏在右上角，很小。可以通过配置显式启用，并挪到更醒目的位置。
使用场景：后台列表页、用户管理表、日志查看页，需要快速定位某行数据。
- 设置
searching: true（默认就是 true，但显式写出来防误关） - 用
dom参数调整布局，比如'rt'把搜索框f提到顶部单独一行 - 加
language: { search: '查找:' }改提示文字，避免英文残留
$('#order-table').DataTable({
searching: true,
dom: '<"top"f>rt<"bottom"lip><"clear">',
language: { search: '查找:' }
});
搜索不区分大小写 + 支持中文模糊匹配
默认 DataTables 搜索是区分大小写的，输入 admin 找不到 Admin；对中文也只支持完整字匹配，搜“张”找不到“张三”。这不是 bug，是默认行为，得手动关掉大小写敏感，并确认编码没问题。
参数差异：caseInsensitive 不是配置项，真正起作用的是 $.fn.dataTable.ext.search 或初始化时的 search.caseInsensitive（v1.10.24+ 支持）。
- 新版推荐直接设
search: { caseInsensitive: true }（注意是search对象下的子字段） - 确保 HTML 页面声明了
<meta charset="UTF-8">，否则中文搜索可能乱码或失效 - 不需要额外写正则或监听 input —— DataTables 内部已做防抖，连续输入不会频繁重绘
禁用搜索或动态开关搜索框
有些表格字段敏感（如含密码列），或者当前视图不该允许搜索（如弹窗内嵌小表），就得关掉搜索。但别用 display: none 隐藏 DOM，那只是视觉隐藏，搜索逻辑还在运行，反而浪费资源。
性能影响：关闭搜索能减少事件监听和字符串比对，对超大表（>5000 行）有明显响应提升。
- 初始化时设
searching: false，整个搜索功能就彻底停用 - 运行时想开关，调用
table.settings()[0].oFeatures.bFilter = false然后table.draw()，但不推荐——易出错 - 更安全的做法：销毁再重建，
table.destroy(); $('#t').DataTable({ searching: false })
容易被忽略的一点：如果表格用了 serverSide: true（服务端搜索），前端的 searching 设置只是控制是否显示搜索框，实际过滤仍由后端完成。这时候改前端配置不会影响结果，得同步检查后端接口是否真接收了 search[value] 参数。
