문자열 비교 스크립트

설명서읽는사람·2019년 11월 22일
0

javascript

목록 보기
1/1

텍스트 비교 후 다른 부분을 찾아 html로 표시하는 스크립트.

다른부분은 'del' 태그에, 같은 부분은 'span' 태그에 들어간다.

구글 diff-match-patch 플러그인을 사용하다가,
공백까지 일치 완전일치 해야하는 기능이 필요할지 몰라 만들어봤다.
구글 플러그인은 원문에 없는 내용을 <ins> 태그에 넣지만 이 스크립트에 <ins> 태그는 없다.
공백까지 일치해야하는 부분은 옵션으로 개선할 여지가 보인다.

<script type='text/javascript'>
/**
 * @param string 원문자열
 * @param string 비교문자열
 * @return string
 *
function txt_diff(o, n) {
    var diff = [];
    for (var i in o) {
        if (o[i] != n[i]) {
            diff.push(i);
        }
    }

    var diff_block = [];
    var idx = 0;
    var idx_flag = null;
    for (var i in o) {
        var flag = diff.indexOf(i) === -1 ? false : true;

        if (idx_flag === null) {
            idx_flag = flag;
        } else if (idx_flag !== flag) {
            idx_flag = flag;
            idx++;
        }

        if (typeof diff_block[idx] === "undefined") {
            diff_block[idx] = {f: flag, v: ""};
        }

        diff_block[idx].v += o[i];
    }

    var html = [];
    for (var i in diff_block) {
        html.push((diff_block[i].f ? "<del>" + diff_block[i].v + "</del>" : "<span>" + diff_block[i].v + "</span>"));
    }

    return html.join('');
}
</script>

0개의 댓글