获取浏览器指定区域内容

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

已注册用户请登录

这是一个创建于 3986 天前的主题，其中的信息可能已经有所发展或是发生改变。

有一个想法，做一个浏览器的插件，或者直接是一个工具，能够用鼠标选取一定的内容？可能是一个框框中，或者是现在的浏览器中选中的那样。然后获取我选定的内容的模板。
我技术不怎么样，不知道这个想法可不可能实现，如果能够实现，大家给一点思路吧。谢谢大家了。

浏览器

内容

获取

14 条回复 • 1970-01-01 08:00:00 +08:00

chon

2013-05-22 11:22:34 +08:00 via Android

就像Evernote web clipper？

ratatata

2013-05-22 12:12:03 +08:00

两个思路：
1.截图，然后OCR
2.DOM Tree解析，类似于Chrome的开发工具盒Firebug的，你选取的区域识别为DOM Tree中相应的HTML，然后取值。

缺点也各自明显：
1.OCR识别率不高
2.可能会因为css定位等各种原因，你选取的区域不一定能准备识别到HTML

shoumu

2013-05-22 18:13:45 +08:00

@chon 对，有没有好的思路

shoumu

2013-05-22 18:18:17 +08:00

@ratatata
1、ocr应该不行，这里我希望能够得到一个模板，下次进入到这里能够直接根据模板提取内容
2、应该是这个方向，但是需要在中间做可视的一层

lycanlancelot

2013-05-23 09:58:51 +08:00

javascript是有这个方法的，就是按照一个坐标，返回一个HTMLElement；或者根据XPATH也可以。

cutehalo

2013-05-23 10:02:35 +08:00

类似于chrome里那个插件？好像叫page monitor吧
可以监控页面指定区域的变化后会有提醒

jiangplus

2013-05-23 10:20:53 +08:00

我以前也想做个这种东西，想要一个Firebug那种元素选取器

clowwindy

2013-05-23 15:05:49 +08:00

以前做过一个标注网页元素的 PATH 工具， PyQT + webkit。用 javascript 获取鼠标 hover 的元素，取出这个元素的大小和位置，然后在上面画一个半透明的框。这样用户就可以选择了。然后在用户点击的时候，取出这个元素你需要的信息。

rrfeng

2013-05-23 15:11:20 +08:00

感觉跟 chrome 的dev tools有点类似，选中一个elements就高亮显示

还有 adblock 的右键添加屏蔽，应该也有差不多的功能。

leojoy710

2013-05-23 16:02:31 +08:00

麦库的剪辑器也是这种...源码里面mknote.inspector部分就是选择htmlelemnt用的...

shoumu

2013-05-25 21:50:16 +08:00

@lycanlancelot
@cutehalo
@clowwindy
@jiangplus
@leojoy710
@rrfeng
这两天没有时间上来看，感谢大家的回复。功能和大家提到的就是差不多，主要就是我自己的技术太烂了，所以有点摸不着头脑。如果还能具体一点，麻烦大家也多指教哈，谢谢啦

binux

2013-05-25 21:52:58 +08:00

要选很容易，获取模版很难

shoumu

2013-05-25 22:50:32 +08:00

@binux 获取对应的xpath就行

binux

2013-05-26 00:17:27 +08:00

@shoumu chrome web store搜索xpath