javascript - 如何在多个文本节点中搜索一个字符串

标签 javascript jquery search

我目前有一个脚本,用于在页面中搜索用户键入的单词,如果找到则突出显示该单词。

然而,当用户在他们正在搜索的字符串中放置一个空格时,这会失败,因为我正在使用 jQuery 将文档文本拆分为节点,并检查每个节点是否包含当前搜索短语。

我想做的是扩展它以搜索用户定义的字符串,而不是在第一个空格后失败。不过,我完全不确定该怎么做,所以我希望有人能帮我解决这个问题。

这是我目前正在使用的方法,用于查找节点:

keyup(function({

    $(instance.textWrapper).html(instance.getOriginalText());               

    if (this.value.length >= instance.startSearchingLength) {

        var regx = new RegExp("(" + escape(this.value) + ")", 'gi');

        $(instance.textWrapper).each(function() {
            var textNodes = $(this).find('*').contents().filter(function(){
                return this.nodeType === 3
        });

        textNodes.each(function(){
            var $this = $(this);
            var content = $this.text();
            content = content.replace(regx, 
                                      '<span class="'
                                      + instance.highlightCssClass +
                                      '">$1</span>');
            $this.replaceWith(content);     
        });
    });
}

startSearchingLength 前面定义为搜索必须搜索的长度。 highlightCssClass 就是 CSS 类在找到字符串后将其包装起来的内容。

失败示例:

搜索 foo bar 将在页面上突出显示 foo 的每个实例,但是一旦遇到空格,这些突出显示就会消失并且无法显示完整的字符串找到了。

因此,代码当前在每个单独的 Text Node 中搜索搜索查询,但我希望让脚本在文件的所有文本中找到任何字符串。我不知道该怎么做,所以非常感谢您的帮助!

谢谢!

最佳答案

简单。您正在使用错误的转义。删除 escape

this.value.replace(/([[\\^$.|?*+()])/g, "\\$1")

你需要转义的是正则表达式的保留字符。

关于javascript - 如何在多个文本节点中搜索一个字符串,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11852417/

相关文章:

c++ - 为图形编写 DFS 迭代器

search - 如果 grep 不匹配,则打印输入的搜索字符串

javascript - 每个 then() 都应该返回一个值或在 Node JavaScript 中抛出 Promise/Always-return

javascript - 如果 $(window).load(function(){}); 该怎么办?太早了

javascript - 在特定的 div 媒体查询中更改父元素的类样式

javascript - 如何在 Javascript 中模拟 "CTRL +S"按键

python - 查找二维数组中最高元素的列表 : Python 3

javascript - 寻找更好的解决方案

javascript - 在运行 jQuery.globalEval() 或 eval() 之前检查 JavaScript(jQuery) 代码的语法

javascript - Javascript 中的 Firebase 身份验证设置