Question

我在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_HERE和PAGE_TITLE_HERE。

我需要做的是从span中删除"remove this"文本。我设法做的是一个笨拙的替换解决方案，看起来像这样：

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

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

1 remove this
2 remove this
3 remove this

变成

1
1
1

有人可以建议一个更优雅的解决方案，删除替换或隐藏“删除此”文本，可能是使用.slice或.trim或.remove或其组合？

提前致谢。

Answer 1

如果您要从元素中删除文字，可以使用contents和filter方法。

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

http://jsfiddle.net/LCUea/

Answer 2

最简单的方法是删除span.title的最后一个孩子，因为你知道你想要的文字在哪里

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

$('span.title').each(function(){
  this.removeChild(this.lastChild);
});

Answer 3

如果您只关注脚本，那么您可以这样使用它：

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

更新：在此工作演示：http://jsfiddle.net/LCUea/4/

现在它将删除跨越＆＃39; .title＆＃39;中所有未包装元素的出现，无论特定文本如何。

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);
});

使用jquery删除span右端的嵌套文本

3 个答案: