JS |突出显示字符串中的重复项

时间:2015-07-11 21:11:16

标签: javascript string

有没有办法在字符串中突出显示(颜色或粗体)重复项。 仅适用于子字符串,后跟字符" QD"

PMC.12547QD/25874QD/26548QD/13254QD/45412QD.T05
PMC.12454QD/19457QD/00035QD/25874QD/17354QD.T05
PMC.00025QD/15454QD.T02

所有文字都位于文本区域。

3 个答案:

答案 0 :(得分:1)

这是一个有趣的小问题(查找和标记重复项,即 - 你必须弄清楚其余部分),所以我给了它一个旋转。

我这样做的方式是两遍:首先计算每个匹配字符串的出现次数,然后再计算第二次实际包裹字符串的次数。在我们处理它的同时,让它成为一个通用函数,您可以传入匹配模式并包装字符串。

两次传球都使用input.replace(),但第一次传球仅将其用于可以在每场比赛中调用一个函数的副作用。此函数甚至不会为返回任何内容而烦恼,因为代码会丢弃input.replace()返回的任何值。

第二遍进行实际替换并返回结果字符串。

var testString =
    'PMC.12547QD/25874QD/26548QD/13254QD/45412QD.T05\n' +
    'PMC.12454QD/19457QD/00035QD/25874QD/17354QD.T05\n' +
    'PMC.00025QD/15454QD.T02';

var output = wrapDuplicates( testString, /\d+QD/g, '{', '}' );
console.log( output );

function wrapDuplicates( input, pattern, open, close ) {
    var counts = {};
    input.replace( pattern, function( match ) {
        counts[match] = ( counts[match] || 0 ) + 1;
    });
    return input.replace( pattern, function( match ) {
        return counts[match] > 1 ? open + match + close : match;
    });
}

此日志:

PMC.12547QD/{25874QD}/26548QD/13254QD/45412QD.T05
PMC.12454QD/19457QD/00035QD/{25874QD}/17354QD.T05
PMC.00025QD/15454QD.T02

答案 1 :(得分:1)

@KaushikThanki - 我是JS的新手,所以我想首先尝试找一个返回重复位置或值的解决方案。以下作品。有没有办法用我的函数返回的索引或值以某种方式突出显示重复项?

    function duplos(){
    var str = document.getElementById("output").value;
    for (var i = 0; i < str.length; i++) {
        var g = str.substring(i,i+5)+"QD";
        var matchA = str.indexOf(g);
        var matchB = str.lastIndexOf(g);
        if(matchA != -1 && matchA != matchB){
            console.log(matchA + " - " + (matchA+7) + " | " + matchB + " - " + (matchB+7))
            console.log(str.substring(matchA,(matchA+7)) + " | " + str.substring(matchB,(matchB+7)))
        }
    }
}

答案 2 :(得分:0)

将文本复制到div并将副本包装在SPAN中,并使用“duplicate”类。

function findDuplicate(input, output) {
    var txt = document.getElementById(input).innerHTML;
    var str = txt.match(/\b\d{5}QD\b/g);
    var dup = [];

    for (i = 0; i < str.length - 1; i++) {
        if (dup[i] == undefined) {
            for (j = i + 1; j < str.length; j++) {
                if (str[i] == str[j]) {
                    if (dup[i] == undefined) txt = txt.replace(new RegExp(str[i], "g"), "<SPAN CLASS='duplicate'>" + str[i] + "</SPAN>");
                    dup[i] = dup[j] = i;
                }
            }
        }
    }
    
    document.getElementById(output).innerHTML = txt.replace(/\n/g, "<BR>");
}

findDuplicate("input", "output");
TEXTAREA, DIV {width: 35em; height: 5em; border: 1px solid black;}
SPAN.duplicate {color: red;}
<TEXTAREA ID="input">
    PMC.12547QD/25874QD/26548QD/13254QD/45412QD.T05
    PMC.12454QD/19457QD/00035QD/25874QD/17354QD.T05
    PMC.00025QD/15454QD.T02
</TEXTAREA>

<DIV ID="output"></DIV>