2

我在一个 html 页面中有多个几乎相同的跨度

<span class="title">          
 <span class="icon icon-title" title="Title">Title:</span> 
 <a href="LINK_HERE">PAGE_TITLE_HERE</a> remove this
</span>

在同一类的 div 和 li 的页面上有几个这样的,唯一不同的是LINK_HEREand PAGE_TITLE_HERE

我需要做的是"remove this"从跨度中删除文本。我设法做的是一个笨拙的替换解决方案,如下所示:

('div.content').html($('div.content').html().replace(/remove this/g,' '))

我对此并不完全满意,因为它替换了页面上所有出现的单词并导致存在其他代码的某些问题。如果我将 div.content 限制为 .title,就会发生奇怪的事情——上述跨度的所有出现都成为第一次出现的副本。IE

1 remove this
2 remove this
3 remove this

变成

1
1
1

谁能提出一个更优雅的解决方案来删除替换或隐藏“删除此”文本,也许,使用 .slice 或 .trim 或 .remove 或它们的组合?

提前致谢。

4

3 回答 3

2

如果要从元素中删除文本,可以使用contentsandfilter方法。

$('span.title').contents().filter(function(i){
    if (this.nodeType === 3) {
       $(this).remove()
    }
})

http://jsfiddle.net/LCUea/

于 2012-10-31T06:33:50.680 回答
0

最简单的方法是删除 的最后一个孩子span.title,因为您知道那是您想要的文本所在的位置

http://jsfiddle.net/LCUea/2/

$('span.title').each(function(){
  this.removeChild(this.lastChild);
});​
于 2012-10-31T06:39:50.050 回答
0

如果您只关心脚本,那么您可以这样使用它:

$('span.title').each(function(){
    $(this).html($(this).html().replace(/remove this/g,' '));
});​​​​​

更新:这里的工作演示:http: //jsfiddle.net/LCUea/4/

现在它将删除跨度“.title”中所有未包装元素的出现,而与特定文本无关。

JS

$('span.title').each(function(){
    //$(this).html($(this).html().replace(/remove this/g,' '));
    var html = '';
    $(this).children().each(function(){
        html += $(this).outerHTML();
    });
    $(this).html(html);
});
于 2012-10-31T06:47:10.937 回答