Javascript 是否有一个针对htmlstring的JS diff库,就像纯文本上的google diff match补丁一样?

Javascript 是否有一个针对htmlstring的JS diff库,就像纯文本上的google diff match补丁一样?,javascript,html,diff,Javascript,Html,Diff,目前我正在使用GoogleDiff match补丁来实现一个实时编辑工具,它可以在多个用户之间同步文本。当操作只是纯文本时,一切都很好,每个用户的操作(添加/删除文本)都可以通过google-diff的帮助与旧文本快照进行比较来区分。但是当涉及到富格式文本(如粗体/斜体)时,google diff在比较htmlstring时无法正常工作。字符的出现打乱了差异结果,尤其是当粗体/斜体格式相互嵌入时 有谁能推荐一个类似的库,比如google diff to diff htmlstrings?或者有什

目前我正在使用GoogleDiff match补丁来实现一个实时编辑工具,它可以在多个用户之间同步文本。当操作只是纯文本时,一切都很好,每个用户的操作(添加/删除文本)都可以通过google-diff的帮助与旧文本快照进行比较来区分。但是当涉及到富格式文本(如粗体/斜体)时,google diff在比较htmlstring时无法正常工作。<和>字符的出现打乱了差异结果,尤其是当粗体/斜体格式相互嵌入时


有谁能推荐一个类似的库,比如google diff to diff htmlstrings?或者有什么建议可以让我的问题通过google diff得到解决?我知道google diff是为纯文本而设计的,但到目前为止,还没有找到比它更好的库,所以如果对google diff进行可行的增强能够有所帮助的话,它也可以工作。

看看,可能会有用。

Pretty diff做了所有你需要的事情,只是你需要更新DOM响应,以便diff针对单击按钮时发生“onkeyup”事件


google diff match补丁项目的wiki分享了一些想法 :

一种方法是使用简单的正则表达式或节点遍历器从HTML中剥离标记。然后将HTML内容与文本内容区分开来。不要执行任何区分清理。通过这种区分,可以将字符位置从一个版本映射到另一个版本(请参阅diff_xIndex函数)。在此之后,可以对纯文本应用所需的所有修补程序,然后将更改安全地映射回HTML。此技术的特点是,尽管文本可以自由编辑,但HTML标记是不可变的

另一种方法是遍历HTML并用Unicode字符替换每个开始和结束标记。检查Unicode规范中未使用的范围。在此过程中,为原始标记创建一个Unicode字符哈希表。结果是一个文本块,可以对其进行修补,而无需担心在标记或breaki中插入文本修改标记的语法。在将内容重新转换回HTML时必须小心,不要丢失任何结束标记

我有一个预感,第二个想法,将HTML标记映射到Unicode占位符,可能比人们猜测的效果更好……特别是如果您的HTML标记来自某个简化集,并且如果您可以在显示交错(删除线/下划线)差异标记时执行一些打开/关闭修饰


另一种可能适用于简单样式的方法是删除HTML标记,但记住受影响的字符索引。然后,执行纯文本差异。最后,使用wiki的第一个方法中的diff_xIndex位置映射思想,智能地重新插入HTML标记,以将样式重新应用到保留/添加的范围。(也就是说,如果原来的位置8-13保留了下来,但移动到了20-25,请在其周围插入B标记。)

jsdifflib-A Javascript Visual Diff工具和库


这里有一个演示:

Gamers2000,谢谢您的评论。我确实尝试了SynchoEdit,但无论是沙盒还是开发版本都无法工作。顺便说一句,我也在你原来的“OT库问题”中提出了一个问题,你是否也在与google diff match patc合作?如何将其与富格式HTMLString一起使用?谢谢你的评论。嗨,史蒂夫,我正在使用diff match补丁,但我正在使用它来同步纯文本。另外,我实际上正在使用MobWrite(),它是diff-match补丁的一个实现。对不起,我帮不了什么忙!新的链接:(demo:)这是怎么回事:转义html字符(,&),完成所有的diff/patch/merge工作,并取消结果的scape。对我来说,这似乎是最稳定的解决方案。我想你会发现,这种方法会产生与不逃避它们完全相同的输出。差分算法没有任何问题对待他们像任何其他字符;问题在于保持它们的平衡,而逃避它们并不能解决这一问题。我经历了这一过程,最终创建了一个包装器库来帮助完成使用
diff_match_补丁所需的“演示工作”
:@arnab-FYI您的JSFIDLE演示程序在FF19/Mac中不起作用(但在Chrome23/Mac中起作用)。@gojomo:谢谢您的提示。刚刚在Mac上查看了FF19(OSX 10.8.2)-工作正常。您会得到什么错误(可能在控制台中)?