jquery只突出单词

时间:2014-02-17 09:00:45

标签: javascript jquery highlight

我想强调单词和单词只是我不想突出单词中间的单词例如“蚂蚁可以杀大象”这里我只想突出蚂蚁...但是当我去突出代码我找到了

jQuery.fn.highlight = function (pat, className,caseSen) {

function innerHighlight(node, pat) {

    var skip = 0;
    if (node.nodeType == 3) {
        if(caseSen==false){
        var pos = node.data.toUpperCase().indexOf(pat);}
        else
        {
            var pos = node.data.indexOf(pat);
        }
        if (pos >= 0) {
            var spannode = document.createElement('span');
            spannode.className = 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.each(function () {
    if(caseSen==false){
    innerHighlight(this, pat.toUpperCase());
    }else
    {
        innerHighlight(this, pat);
    }
});

};

突出“蚂蚁可以杀大象” 我只想在这里突出蚂蚁。

我正在使用内容可编辑div

2 个答案:

答案 0 :(得分:1)

function innerHighlight(node, pat) {
  var html = node.innerHTML;
  var rexp = new RegExp( '\\b('+pat+')\\b', 'igm' );
  html = html.replace( rexp, '<span class="hl">$1</span>' );
  node.innerHTML = html;
}

和示例http://jsfiddle.net/9ELur/

答案 1 :(得分:1)

查看mark.js,它可以突出显示您的自定义关键字或正则表达式。例如:

$(".context").mark("keyword");