乐趣区

关于javascript:googlediffmatchpatch文本内容对比的使用

我的项目外面用到了文本的比照性能,就用了下 google-diff-match-patch,不过也是只用了文件比照性能。这里来看一下是怎么应用的。

参考链接:

google-diff-match-patch

Diff demo

Github 地址

这个库反对多语言,demo 是间接应用 javascript 做的。

上面的应用是依据 wiki 和本人的一些简略的了解来写的

Introduction
不同的语言应用的办法是一样的,不同语言的应用首先都要先引入这个 library。

应用的时候,先创立一个 diff_match_patch 对象,这个对象内就蕴含咱们所要应用的比照办法。

依照 google 的 javascript 的 demo,创建对象

var dmp = new diff_match_patch();

比照,就能够得出比照后果

var d = dmp.diff_main(text1, text2);

装置文档的阐明,这个文本的比照后果对用户不肯定敌对,比方咱们齐全扭转了 2 段文字,然而去比照的话,可能得出的后果是依照一个一个字母的程序去比照,得出的后果就不是咱们想要的,所以就要用到其余的两个办法,对用户的敌对水平会好一些,这个中央能够依据应用在 demo 的页面尝试抉择办法。比较简单的是应用

dmp.diff_cleanupSemantic(d);

如果更好一些咱们能够应用,而后依据自已定义的 Diff_EditCost 得出咱们更想要的后果

dmp.diff_cleanupEfficiency(d);

如果须要展现到页面,能够应用 diff_prettyHtml

dmp.diff_prettyHtml(d);

繁难的 javascript 实现代码

let diffUntil = new diff_match_patch();

function diffText(diffType) {// 3 个比照调用一个办法,传入不同参数而已

      let text1 = document.getElementById(‘text1’).value; // 文本域 1

      let text2 = document.getElementById(‘text2’).value;  // 文本域 2

      let editCost = document.getElementById(‘editCost’).value || 4;  // 没填的时候默认为 4

      let d = diffUntil.diff_main(text1, text2);   // 比照

      if (diffType === ‘semantic’) {

            diffUntil.diff_cleanupSemantic(d);

      }

    if (diffType === ‘efficiency’){

        diffUntil.Diff_EditCost = parseInt(editCost);

        diffUntil.diff_cleanupEfficiency(d);

    }

    let diffHtml = diffUntil.diff_prettyHtml(d);  // 转化为 html

    document.getElementById(‘result’).innerHTML = diffHtml;

}

Demo 地址,源代码间接页面调试就能够看到

http://avery.coding.me/goodgo…

作者:avery1
链接:https://www.jianshu.com/p/523…
起源:简书
著作权归作者所有。商业转载请分割作者取得受权,非商业转载请注明出处。

退出移动版