Javascript 用另一个字符串替换匹配的字符串

我正在尝试创建一个搜索框，以在html标记（如p、span等）中查找搜索到的模式，就像浏览器的ctrl+f选项一样

Javascript:

function searchKeyword(){
        var keyword = document.searchform.searchbox.value;
        $("#paragraph").each(function() {
            var string = $(this).text();
            newstring = string.replace(keyword, '<span style="background-color: #faf701;">'+keyword+'</span>');
            $(this).text(newstring);
        });
    }

函数searchKeyword（）{
var关键字=document.searchform.searchbox.value；
$（“#段落”）。每个（函数（）{
变量字符串=$（this.text（）；
newstring=string.replace（关键字“+”关键字+”；
$（this）.text（新闻字符串）；
});
}

唯一的问题是，它不会将字符串作为html标记读取，而是作为简单字符串读取，并准确输出：

<span style="background-color: #faf701;">'+keyword+'</span>

“+关键字+”

而不是突出显示的字符串。

因为您正在使用，因为您希望使用

---

由于您有id选择器，因此无需使用

.each（）

函数searchKeyword（）{
var关键字=document.searchform.searchbox.value；
$（“#段落”）.html（函数（i，html）{
返回$（this）.text（）.replace（关键字“”+关键字+“”）；
})
}

---

使用正则表达式替换多个匹配项

function searchKeyword() {
    var keyword = document.searchform.searchbox.value;
    var regex = new RegExp(RegExp.escape(keyword), 'g')

    $("#paragraph").html(function (i, html) {
        return $(this).text().replace(regex, '<span style="background-color: #faf701;">' + keyword + '</span>');
    })
}


if (!RegExp.escape) {
    RegExp.escape = function (value) {
        return value.replace(/[\-\[\]{}()*+?.,\\\^$|#\s]/g, "\\$&")
    };
}

函数searchKeyword（）{
var关键字=document.searchform.searchbox.value；
var regex=new RegExp（RegExp.escape（关键字），'g'）
$（“#段落”）.html（函数（i，html）{
返回$（this）.text（）.replace（regex，“+关键字+”）；
})
}
如果（！RegExp.escape）{
RegExp.escape=函数（值）{
返回值.replace（/[\-\[\]{}（）*+？，\\\^$\\\\s]/g，“\\$&”）
};
}

我刚刚发现我使用的这个脚本不能替换多个匹配，你能告诉我如何解决这个问题吗？

function searchKeyword() {
    var keyword = document.searchform.searchbox.value;

    $("#paragraph").html(function (i, html) {
        return $(this).text().replace(keyword, '<span style="background-color: #faf701;">' + keyword + '</span>');
    })
}

function searchKeyword() {
    var keyword = document.searchform.searchbox.value;
    var regex = new RegExp(RegExp.escape(keyword), 'g')

    $("#paragraph").html(function (i, html) {
        return $(this).text().replace(regex, '<span style="background-color: #faf701;">' + keyword + '</span>');
    })
}


if (!RegExp.escape) {
    RegExp.escape = function (value) {
        return value.replace(/[\-\[\]{}()*+?.,\\\^$|#\s]/g, "\\$&")
    };
}