如何使用jquery突出显示html中的单词

可能重复：

我想突出显示html

标记中的某些单词，但我想避免突出显示

中的单词

现在，当我搜索单词“sample”时，我不想突出显示锚标记中包含的单词sample。

1。要进行突出显示的jQuery插件： 3.包含插件和样式后要运行的jQuery代码：

//将部分字符串替换为span css样式的元素
//即textsample=>textsample
$（'p'）.replaceText（/（示例）/gi，$1'）；

或者按照@Nick C.在评论中的建议

// replace full string occurrences with a span css styled element
// i.e. ONLY sample => <span class="highlight">sample</span>
$('p').replaceText(/\b(sample)\b/gi, '<span class="highlight">$1</span>');

//用span css样式的元素替换完整字符串
//即，仅样本=>样本
$（'p'）.replaceText（/\b（示例）\b/gi，$1'）；

---

插件足够聪明，不会替换元素的属性，也不会替换元素中的文本，例如

a

element…

这有帮助吗？我建议使用单词边界（\b）来匹配单词。例如，$（（“p”）.replaceText（/\b（rain）\b/gi，…）将匹配“rain”，但不匹配“train”。@Nick C.：好的，如果部分事件应高亮显示或不高亮显示，这取决于OP。尽管如此，我还是要在这里加上它。谢谢你的评论。我必须做出改变，使它足够强大，可以做我想做的事。见：

/**
* jQuery plugin to replace text strings
*
* Taken from @link http://net.tutsplus.com/tutorials/javascript-ajax/spotlight-jquery-replacetext/
*/

$.fn.replaceText = function( search, replace, text_only ) {
return this.each(function(){
        var node = this.firstChild,
        val, new_val, remove = [];
        if ( node ) {
            do {
              if ( node.nodeType === 3 ) {
                val = node.nodeValue;
                new_val = val.replace( search, replace );
                if ( new_val !== val ) {
                  if ( !text_only && /</.test( new_val ) ) {
                    $(node).before( new_val );
                    remove.push( node );
                  } else {
                    node.nodeValue = new_val;
                  }
                }
              }
            } while ( node = node.nextSibling );
        }
        remove.length && $(remove).remove();
    });
};

// replace partial string occurrences with a span css styled element
// i.e. textsample => text<span class="highlight">sample</span>
$('p').replaceText(/(sample)/gi, '<span class="highlight">$1</span>');

// replace full string occurrences with a span css styled element
// i.e. ONLY sample => <span class="highlight">sample</span>
$('p').replaceText(/\b(sample)\b/gi, '<span class="highlight">$1</span>');