使用JavaScript突出显示html文本

我正在开发一个函数来突出html内部的div，我已经检查过一些答案，但我没有找到任何解决方案，我的情况。事情是，我居然有功能不会在同一时间，例如与2双HTML标签的工作：使用JavaScript突出显示html文本

有了这个HTML代码：

<span>Les malalties vasculars cerebrals (MVC) 
     conegudes també com a <i>feridures o ictus</i> representen la tercera causa de

而这个功能的使用jQuery

jQuery.fn.highlight = function(pat) { 
function innerHighlight(node, pat) { 
    var skip = 0; 
    if (node.nodeType == 3) { 
    var pos = node.data.toUpperCase().indexOf(pat); 
    if (pos >= 0) { 
    var spannode = document.createElement('span'); 
    spannode.className = 'highlight'; 
    var middlebit = node.splitText(pos); 
    var endbit = middlebit.splitText(pat.length); 
    var middleclone = middlebit.cloneNode(true); 
    spannode.appendChild(middleclone); 
    middlebit.parentNode.replaceChild(spannode, middlebit); 
    skip = 1; 
    } 
    } 
    else if (node.nodeType == 1 && node.childNodes && !/(script|style)/i.test(node.tagName)) { 
    for (var i = 0; i < node.childNodes.length; ++i) { 
    i += innerHighlight(node.childNodes[i], pat); 
    } 
    } 
    return skip; 
} 
return this.length && pat && pat.length ? this.each(function() { 
    innerHighlight(this, pat.toUpperCase()); 
}) : this; 
}; 

jQuery.fn.removeHighlight = function() { 
return this.find("span.highlight").each(function() { 
    this.parentNode.firstChild.nodeName; 
    with (this.parentNode) { 
    replaceChild(this.firstChild, this); 
    normalize(); 
    } 
}).end(); 
};

列表项

如果我搜索： “莱斯” 的作品好。

如果我搜索：“feridures”作品罚款也。

但如果我搜索“com feridures”功能不higlight我的文本。

这是我需要完成我的应用程序的唯一事情。

来源

2013-03-14 mcones

“这是我需要完成我的aplication的唯一的事情。”著名遗言 – 2013-03-14 18:49:23

问题不在于HTML标签，它的确如此，但它与两个标签无关。事实是，你的应用程序正在搜索文字文本，这意味着它发现“com feridures”而不是“feridures”，所以没有匹配。

您可以使用jQuery先将该跨度的HTML去除，然后它将起作用。

$(".highlight").html($(".highlight").text());

例子：http://jsfiddle.net/calder12/nJ5mQ/

来源

2013-03-14 19:12:50

使用JavaScript突出显示html文本

回答

相关问题