Plugins 如何为“创建插件”；“记录”；web刮取执行步骤到文件中？

我经常被指派创建网页抓取算法，我一直在做的是直接到抓取代码，这使得每个工具页面都是特定的

我想为浏览器创建一个插件（最好是JavaScript），这样用户就可以动态地定义刮片执行序列（记录一个脚本，稍后将对实际刮片进行解释和执行）

其思路如下：

用户打开要刮取的页面，右键单击任意位置， 点击“开始录制”，这将“激活”插件并保存 该页面指向其“录制文件”的URL

对于用户需要单击/键入/更改的每个元素，他 右键单击它，将显示一组特定于元素的选项。这个 插件按顺序保存这些选择的选项

---

• 可以单击按钮
• 编辑内容可以用单个特定字符串填充，也可以循环删除 使用文件中的字符串列表
• 可以为列表中的每个项目或项目循环刮取列表 与文件中的列表相匹配的
• 等等

---

录制完成后，用户只需右键单击任意位置并点击“停止录制”，他将拥有一个类似脚本的文件，其中包含所需的刮片操作

之后，实际的刮片应用程序接管（自动或手动启动），只读取记录的文件，执行描述的操作并保存生成的页面

这些生成的页面稍后可以通过更简单的编码页面特定算法进行解析

---

我知道说起来容易做起来难，但我很确定编写代码是可能的。我想要一些关于“子步骤”的帮助：

• “如何在浏览器的（+元素）中显示新选项” 关联菜单？”
• “如何知道右键单击了哪个元素？”
• “如何从加载项写入文件？”
• 等等

---

虽然这些问题中的一些以前已经被问过了，但大多数都是在不同的背景下提出的；也就是说，您已经知道单击了哪个元素，并且希望在单击后执行函数的上下文；这里的情况并非如此。

在过去的几天里，我实际上一直在编写一个Greasemonkey脚本：

它的工作原理如下

在页面中插入一个“刮削界面”

将mouseup侦听器注册到文档

当鼠标向上移动事件发生时，提取用户的选择，并将选择标记为要刮取的数据

在页面中插入div/class以突出显示要刮取的数据

使用GM_设置值存储所有刮削说明/访问页面

在文本区域中显示一个抓取脚本，以便用户可以将其复制/粘贴到抓取应用程序

---

那么，刮削界面是如何实现的呢？我已经了解了所需的超级步骤，但如何在其中执行子步骤？子步骤在很大程度上取决于您希望它的外观，还有一点取决于您希望废弃的内容。使用greasemonkey，您只需使用基本的Javascript即可：例如，我的“scraping interface”只不过是一个带有position:fixed、一些选项和一个用于输出的div$（文档），带有jquery的mouseup捕捉所有鼠标点击，window.getSelection（）返回选择。。。