实现两段文字模式匹配对比的JS算法

 

<div id="txt1" style="border:1px solid black">Hello123 World 123</div>

<div id="txt2" style="border:1px solid black">Hello World 456</div>

<div id="txt3" style="border:1px solid red"></div>
<div id="txt4" style="border:1px solid red"></div>

<script type="text/javascript">
<!--
    function compare_str(str1,str2)...{
        var res1 = "";
        var res2 = "";

        while(str1.length && str2.length)...{
            var arr = find_pos(str1,str2);
            if (arr && arr.length)
            ...{
                if (arr[0])
                ...{
                    res2 +=("<font color='green'>" + str2.substr(0,arr[0]) + "</font>");
                    str2 = str2.substr(arr[0]);
                }
                res1 +=(str1.substr(0,arr[1]));
                res2 +=(str2.substr(0,arr[1]));         

                str1 = str1.substr(arr[1]);
                str2 = str2.substr(arr[1]);

            }else...{
                arr = find_max_pos(str1,str2); 
                tmp = find_match_pos(str1,str2);

                if (tmp.length)
                ...{               
                    if (arr[0]>tmp[0] && arr[1]>tmp[1])
                    ...{
                        arr = tmp;
                    }
                }
 
                if (arr!=undefined && arr.length)
                ...{               
                    res1 +=("<font color='red'>" + str1.substr(0,arr[0]) + "</font>");
                    res2 +=("<font color='red'>" + str2.substr(0,arr[1]) + "</font>");
                    res1 +=(str1.substr(arr[0],arr[2]));
                    res2 +=(str2.substr(arr[1],arr[2]));

                    str1 = str1.substr(arr[0]+arr[2]);
                    str2 = str2.substr(arr[1]+arr[2]);
                }else...{
                    res1 +=("<font color='blue'>" + str1 + "</font>");
                    res2 +=("<font color='green'>" + str2 + "</font>");
                    str1 = '';
                    str2 = '';
                }
                
            }
        }
        if (str1.length)
        ...{
            res1 +=("<font color='blue'>" + str1 + "</font>");
        }
        if (str2.length)
        ...{
            res2 +=("<font color='green'>" + str2 + "</font>");
        }
        
            

        document.getElementById("txt3").innerHTML = (res1); 
        document.getElementById("txt4").innerHTML = (res2); 
    }
    
    //从串2查找对串1前N个字符的最大匹配
    function find_pos(str1,str2)...{
        var len = 1, pos = 0;
        var ret;    
        
        while (pos>=0)...{  //在str2中找不到字符时返回-1退出循环
            var str = str1.substr(0,len);
            pos = str2.indexOf(str);
            if (pos!=-1)
            ...{
                ret = [];
                ret.push(pos,len);  //将匹配开始的位置和匹配长度压入数组
                len++;  //增加一个匹配长度
                if (len>str1.length)...{  //匹配长度大于str1长度时退出
                    break;
                }
                
            }else...{
                break;
            }
        }

        return ret;
    }
    
    //从串2查找对串1从第N个字符开始前N个字符的首次匹配
    function find_match_pos(str1,str2,arr)...{
        var len =1 , pos1 = 0, pos2 = 0, _pos2;
        var ffind = false;
        var ret = [];
        
        if (arr!=undefined)
        ...{
            pos1 = arr[0];pos2 = arr[1];
        }
        while((pos1+len)<str1.length)...{
            var str = str1.substr(pos1,len);
            _pos2 = str2.indexOf(str);
            if (_pos2!=-1)
            ...{
                ffind = true;len++;pos2 = _pos2;
            }else...{
                if (ffind)
                ...{
                    len--;break;
                }else...{
                    pos1 += len;len = 1;
                }
            }           
        }

        if (ffind)
        ...{
            ret.push(pos1,pos2,len);
        }else...{
            ret = [];
        }
        
        return ret;
    }
    
    //查找下一个最适匹配
    function find_next_pos(str1,str2)...{

    }
    
    //查找两个字串的字符数目最大匹配
    function find_max_pos(str1,str2)...{
        var ret,pos1,pos2,arr=null;
        var res, max = 0;
        do
        ...{
            ret = find_match_pos(str1,str2,arr);
            if (ret.length)
            ...{
                if (ret[2]>max)
                ...{
                    res = ret;
                    max = ret[2];
                }
                
                arr = new Array(ret[0]+1,ret[1]);
                 
            }
        }
        while (ret.length);

        return res;
    }

    function test()...{
        var str1 = document.getElementById("txt1").innerText;
        var str2 = document.getElementById("txt2").innerText;

        compare_str(str1,str2);
    }
    

    test();
//-->
</script>