html - 有没有办法在 和 中搜索可搜索的文本？

Question

在大多数浏览器中使用 Ctrl-F 将允许您搜索文本，但仅限于文本区域。我想在应该是可访问区域的文本中搜索文本，这些区域不一定是文本呈现区域，例如 <map ...><area title="searchable text" /></map>和 <img alt="searchable text" /> .是否有浏览器或插件可以满足我的要求？这些东西在这里是为了可访问性，但它似乎并不是真的那么容易访问(除了鼠标悬停，这又不是那么容易访问)。

注意

一个必需的答案，不使用与 View 分离的东西。 IE。搜索源代码不是一种选择，因为这在很大程度上难以阅读(尤其是在复杂页面上)并且不会显示信息在呈现页面上的位置。

Answer 1

Is there a browser or addon that will do what I'm asking for?

哦，是的。 Lynx 浏览器做到了。但我想这不是解决方案 ;-)

如果您的问题是这样，则无法覆盖 CTRL+F 在您的浏览器中执行的操作。

您可以在您的网站内设计一个自定义插件，或为您的浏览器设计一个插件。这会很容易......但需要其他捷径。

如果您的主要问题是根据标签的 alt 或 title 属性内容定位标签，这在 javascript 中很容易:

 var search='enter image';
 var nodes=document.querySelectorAll("[alt*='"+search+"'],[title*='"+search+"']");

然后您可以使用 jquery 或您想要的方式突出显示匹配的节点。

for (i in nodes) {
   nodes[i].className+=' resultHighlighted';
}

并滚动到第一个结果: 节点[0].scrollIntoView();

如果您打算创建一个浏览器插件，您可以创建您的自定义小书签或自定义插件，并将快捷方式关联到该书签(参见 https://github.com/iSunilSV/Chrome-Bookmark-Shortcut)

通过 title 或 alt 属性找到第一个匹配项并滚动到它的简单书签将是这样的:

javascript:text=prompt("search inside alt or title attribute");
document.querySelector("[alt*='"+text+"'],[title*='"+text+"']").scrollIntoView();