纯文本比对之diff_match_patch.js

采编流程

先说一下我们单位的稿件采编流程，记者写完一篇稿件后会先把稿件保存到库（第一个版本），然后编辑去修改（第二个版本），然后一审审核（有问题修改那就是第三个版本），二审（第四个版本），三审（第五个版本）。然后还有三校。最后才会发布到线上。这当中就产生了n个版本。

需求

现在需求就是需要把每个版本跟第一个版本或者其他版本比对，并标记出有差异的地方。

diff_match_patch.js

用谷歌的google-diff-match-patch 库来计算差异。

主要代码

<H3>版本1</H3>
    <TEXTAREA ID="text1" STYLE="width: 100%" ROWS=10>测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试</TEXTAREA>

<H3>版本2</H3>
<TEXTAREA ID="text2" STYLE="width: 100%" ROWS=10>测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试测试</TEXTAREA>

<DIV ID="outputdiv"></DIV>

<div style="margin-top: 30px"><INPUT TYPE="button" onClick="launch()" VALUE="比对"></div>

var dmp = new diff_match_patch();
function launch() {
  var text1 = document.getElementById('text1').value;
  var text2 = document.getElementById('text2').value;
  dmp.Diff_Timeout = 1;
  dmp.Diff_EditCost = 4
  var ms_start = (new Date()).getTime();
  var d = dmp.diff_main(text1, text2);
  var ms_end = (new Date()).getTime();
  var ds = dmp.diff_prettyHtml(d);
  document.getElementById('outputdiv').innerHTML = ds + '<BR>Time: ' + (ms_end - ms_start) / 1000 + 's';
}