0

抱歉，标题很垃圾，很难解释。简化版本...我有以下标记：

<a href="http://www.someurl.com/product/collection"><span class="collection">View</span> this collection today.</a>

现在，我想要结束的是以下内容：

<a href="http://www.someurl.com/product/collection"><span class="collection">View</span> this <span class="someClass">collection</span> today.</a>

我主要可以通过以下方式做到这一点：

var $el = $('a');
var newHTML = $el.html().replace(/collection/g, '<span class="someClass">collection</span>');
$el.html(newHTML);

问题是，我们最终得到：

<a href="http://www.someurl.com/product/collection"><span class="<span class="someClass">collection</span>">View</span> this <span class="someClass">collection</span> today.</a>

这显然不是我想要的......我要不要脸？我应该以不同的方式这样做吗？

这是一个非常简单的例子，这个词可能不是“集合”，并且可能在元素文本中出现多次。我也尝试过使用 $.text() 但跨度标签被转义，正如您所期望的那样，并显示为文本“集合”。

我错过了什么？

编辑：

我编辑了这些示例，因为它们完全错误，根本不是我要问的！对不起！

4

1 回答 1

1

尝试：

$('a:contains(collection)').html(function() {
    return $(this).html().replace('collection', '<span class="someClass">collection</span>');
});

jsFiddle 示例

生成的 HTML 是：

<a href="http://www.someurl.com/product/collection">View this <span class="someClass">collection</span> today.</a>

如果您想多次替换单词集合，请将替换行更改为：

.replace(/collection/g, '<span class="someClass">collection</span>')
于 2013-08-20T16:13:35.813 回答