javascript - Javascript标记子字符串onchange事件

Question

我正在尝试突出显示大字符串的子字符串。以下代码仅在子字符串是大字符串的第一个字母时突出显示。我怎样才能解决这个问题？提前致谢

 function search() {
        var text = document.getElementById("searchText").value;

        if (!text) return;

        var regex =  new RegExp(text, 'gi');
        var str = document.getElementById("input").innerHTML;
        var n=str.match(regex);

            document.getElementById("input").innerHTML = document.getElementById("input").innerHTML.replace(str, '<span style="background-color:clear;">'+str+'</span>'); // clear 
            document.getElementById("input").innerHTML = document.getElementById("input").innerHTML.replace(n, '<span style="background-color:yellow;">'+n+'</span>');


    }

Answer 1

尝试这个：-

演示

function search() {
    var hid = document.getElementById('hidtxt').value;
    if(hid.length == 0) hid.value=document.getElementById("input").innerHTML;
        var text = document.getElementById("searchText").value;
       if (!text) return;
        var regex =  new RegExp(text, 'gi');
            document.getElementById("input").innerHTML = hid.replace(regex, '<span style="background-color:yellow;">$&</span>');


    }

Answer 2

str.match(regex) 返回一个数组，这就是替换无法正常工作的原因。

replace 方法可以接受您应该提供给它的正则表达式（以实现全局搜索）。

document.getElementById("input").innerHTML = str.replace(regex, '<span style="background-color:yellow;">'+text+'</span>');