如何用JavaScript触发谷歌Chrome浏览器的搜索/查找功能?
如何用JavaScript触发Chrome的搜索/查找功能?
先说说window.find()的局限
你提到用window.find("sometext")无效,这很正常——这个API只能搜索当前页面的DOM内容,完全没法触及内嵌PDF里的内容。因为Chrome原生的PDF查看器是作为独立组件运行的,它的内容不在网页的DOM树里,也不受网页JS的直接控制,所以window.find()对它束手无策。
能不能触发Chrome原生的Ctrl+F查找?
很遗憾,目前没有官方的JavaScript API能直接触发Chrome的原生查找功能。这个查找窗口是浏览器层面的核心功能,出于安全和权限控制的考虑,浏览器并没有开放给网页JS调用的接口。
你可能会想:那能不能模拟Ctrl+F的键盘事件?比如用dispatchEvent模拟按下Ctrl和F键?我试过很多次,现代Chrome会直接拦截这类模拟的浏览器快捷键事件,防止恶意脚本滥用——这种方法基本行不通。
替代方案:自定义整合查找
如果你的需求是必须同时搜索DOM和内嵌PDF,只能走自定义的路子:
- 如果能控制PDF的渲染方式:放弃用Chrome原生的PDF嵌入,改用像PDF.js这样的开源库来渲染PDF。PDF.js会把PDF内容转化为网页可访问的DOM元素(或Canvas上的文本层),这样你就可以:
- 对网页DOM部分用
window.find()或者手动遍历DOM节点实现查找 - 对PDF.js渲染的内容,调用它自带的查找API(比如
PDFViewerApplication.findController.executeCommand('find', { query: 'sometext' })) - 最后把两部分的查找结果整合展示给用户
- 对网页DOM部分用
- 如果没法改PDF的嵌入方式:那基本没办法实现同时搜索DOM和PDF的功能,只能让用户手动用Ctrl+F——毕竟这是唯一能同时覆盖两者的原生方式。
内容的提问来源于stack exchange,提问作者Rolando




