比较两个页面的内容
Compare contents of two pages
关于现有工具的问题。
背景：
我有一个系统，我们经常使用版本控制。为了比较版本，我们现在将信息转储为文本格式，然后用彩色标记打印文本的两个版本。我长得不好看，用户也很难理解。
我想对此进行改进，并实际显示两个版本的网页重新标记，然后使用某种 css 标记来显示两个页面之间的差异。我认为这种方法的问题是 dom 中有很多对象不会直接影响渲染，因此需要过滤掉以使差异有意义。
问题：
是否有任何现有工具可以让我比较页面的 doms，然后呈现应用某种视觉线索来添加、更改或删除的内容？它只需要在浏览器中 运行。
这是一个可行的方法吗？
实现此目的的一种方法是（自动）截取 2 dom 结构的屏幕截图并比较这些图像。这样你就不是 saving/rendering dom。你甚至可以使用像 node 这样的无头浏览器来为你做这件事，让它快速轻松地集成到你的自动化测试中。
有几种工具可以帮助您完成此操作，而不是从头开始编写自己的工具，例如 resemble.js. (however if you prefer you can use phantomjs and casperjs 使用他们的 api 自己编写。
这些工具可让您突出显示两张图片中的差异
还有一篇不错的文章here on automated-screenshot-diff是另外一个节点包，可以对比两张dom效果图的截图
关于现有工具的问题。
背景： 我有一个系统，我们经常使用版本控制。为了比较版本，我们现在将信息转储为文本格式，然后用彩色标记打印文本的两个版本。我长得不好看，用户也很难理解。
我想对此进行改进，并实际显示两个版本的网页重新标记，然后使用某种 css 标记来显示两个页面之间的差异。我认为这种方法的问题是 dom 中有很多对象不会直接影响渲染，因此需要过滤掉以使差异有意义。
问题： 是否有任何现有工具可以让我比较页面的 doms，然后呈现应用某种视觉线索来添加、更改或删除的内容？它只需要在浏览器中 运行。 这是一个可行的方法吗？
实现此目的的一种方法是（自动）截取 2 dom 结构的屏幕截图并比较这些图像。这样你就不是 saving/rendering dom。你甚至可以使用像 node 这样的无头浏览器来为你做这件事，让它快速轻松地集成到你的自动化测试中。
有几种工具可以帮助您完成此操作，而不是从头开始编写自己的工具，例如 resemble.js. (however if you prefer you can use phantomjs and casperjs 使用他们的 api 自己编写。
这些工具可让您突出显示两张图片中的差异
还有一篇不错的文章here on automated-screenshot-diff是另外一个节点包，可以对比两张dom效果图的截图