1

我有一个用跨度包装文本的函数

$(".ui-content").html(function (i, v) 
  {  
     return v.replace(/(CANADA)/gi, '<span class="query">$1</span>'); 
});

但是，当我传入术语"div"or "span"or "a"which are html 时，页面当然会变得一团糟。

我可以更改什么regex以仅删除不属于 html 代码<strong>但确实可以使用的文本A strong person is a helpful friend

4

3 回答 3

1

节点操作救援，一如既往！

function toArray(obj) {
    var r = [];

    for(var i = 0; i < obj.length; i++) {
        r.push(obj[i]);
    }

    return r;
}

$('.ui-content').each(function() {
    var stack = [this];
    var c, n;

    while(c = stack.pop()) {
        var childNodes = toArray(c.childNodes);

        for(var i = 0; n = childNodes[i]; i++) {
            if(n.nodeType === 1) {
                stack.push(n);
            } else if(n.nodeType === 3) {
                var matches = n.nodeValue.split(/(CANADA)/i);

                for(var i = 0; i < matches.length; i++) {
                    var newNode;

                    if(/CANADA/i.test(matches[i])) {
                        newNode = document.createElement('span');
                        newNode.className = 'query';
                        newNode.appendChild(document.createTextNode(matches[i]));
                    } else {
                        newNode = document.createTextNode(matches[i]);
                    }

                    n.parentNode.insertBefore(newNode, n);
                }

                n.parentNode.removeChild(n);
            }
        }
    }
});

这是一个演示 jsFiddle。

于 2012-07-05T02:34:36.330 回答
1

与@elclanrs 相同的概念，但模仿了负面的外观：

$(".ui-content").html(function (i, v) {       
     return v.replace(/([^</])(strong)/gi, ' <span class="query">$2</span> ');
});​

http://jsfiddle.net/39VMe/

还有一篇关于如何处理 JavaScript 正则表达式的某些限制的好文章：http: //blog.stevenlevithan.com/archives/mimic-lookbehind-javascript

于 2012-07-05T03:02:28.550 回答
0

我知道人们通常坚持不使用正则表达式来解析 html，但是嘿，这似乎工作得很好。这使用否定前瞻来仅替换单词“strong”而不是实际<strong>标签：

/strong(?!>)/

编辑：

使用这个更灵活并允许属性的正则表达式：

/strong(?!(>|\s\w+=))/g;

无论如何，这一切都取决于您的 HTML。如果正则表达式不这样做，那么您必须正确解析。

演示：http: //jsfiddle.net/mGLjb/2/

于 2012-07-05T02:45:47.133 回答