5

我想制作一个删除内容中任何特定单词的功能

我得到了这个代码

jQuery

<script>
$(document).ready(function(){
    $('#cl').click(function(){
        $('div').remove(':contains("kamal")');
    });
    
    
})
</script>

HTML

<div>asdjh alsdhj kamal ljkahsdhasd lakshd kamal</div>
<div ><a href="#" id="cl">click</a></div>
<div>asdjh alsdhj  ljkahsdhasd lakshd </div>

但它删除整个div包含kamal我只想从我的内容中删除这个词而不是整个div你也可以在这里看到我的代码的在线演示

4

7 回答 7

4

对元素进行读-修改-写的正确方法是使用 jQuery 的“函数参数”方法:

$('div:contains(kamal)').filter(function() {
    return $(this).children().length === 0;  // exclude divs with children
}).text(function(index, text) {
    return text.replace(/kamal/g, '');
});

这样避免了调用.text()两次,也简化了代码逻辑。

请注意,如果您有嵌套标签,您可能会得到不寻常的结果,因为伪选择器会考虑所有后代,而不仅仅是直接子代,并且是自上而下而不是自下而上。这就是为什么上述解决方案包含初始调用,以确保仅考虑 DOM 树中的叶节点。div:contains().filter

另一种方法是使用.contents并直接查看 DOM 文本节点:

var re = /kamal/gi;

$('div').contents().each(function() {
    if (this.nodeType === 3 && this.nodeValue.match(re)) {
        this.nodeValue = this.nodeValue.replace(re, '');
    }
})​

https://jsfiddle.net/alnitak/eVUd3/

编辑第二个示例更新为使用string.match(regex)而不是regex.test(string).

于 2012-05-15T08:11:37.097 回答
2

这应该适合你

 <script>
 $(document).ready(function(){
     $('#cl').click(function(){             
        var ka = /kamal/gi;

        $('div').contents().each(function() {

            // this.nodeType === 3 selects the text nodes section of the DOM
            // then ka.test(this.nodeValue) performs a regex test on the text 
            // in the node to see if it contains the word "kamal" with the 
            // global /g flag to search the entire string and /i to be case 
            // insensitive

            if (this.nodeType === 3 && ka.test(this.nodeValue)) {
                this.nodeValue = this.nodeValue.replace(ka, '');
            }
            // this section catches the text nodes within the child and 
            // performs the same operation
            $(this).contents().each(function() {
                if (this.nodeType === 3 && ka.test(this.nodeValue)) {
                     this.nodeValue = this.nodeValue.replace(ka, '');
                }
            })        
        })

     })
 });
 </script>

编辑:将简单的字符串替换更改为全局正则表达式替换,因此一键替换所有实例。有关工作示例,请参阅JSFiddle 。

编辑:基于@Alnitak 的评论,他指出以前版本的代码删除了包含文本而不仅仅是文本的整个子元素是正确的,新的更新版本不会破坏 DOM 并删除关键字的所有实例“kamal”请参阅更新的 JSFiddle

于 2012-05-15T07:31:57.990 回答
1
var $div = $('div');
$div.text($div.text().replace('yourword', ''))
于 2012-05-15T07:27:11.487 回答
0

remove 函数从 DOM 中删除一个节点,不仅是她的内容

尝试$('div).text().replace('kamal','');

编辑:这个正在工作

$('div').text($('div').text().replace('kamal', ''));

https://jsfiddle.net/qH4CJ/

于 2012-05-15T07:26:53.220 回答
0

用这个:

 $('#cl').click(function(){
        $('div').each(function(){
            $(this).text($(this).text().replace(/kamal/g, '');
          });
 });
于 2012-05-15T07:43:02.573 回答
0

由于text()获取了值并text( "someValue" )设置了值,因此您只需将一个放在另一个里面。这应该适合你

https://jsfiddle.net/nnsP4/

$(document).ready(function() {
  $('#cl').click(function(){
      $('div:contains("kamal")').each(function(){
         var text = $(this).text();
         var newValue =  text.replace('kamal', '');
          $(this).text(newValue);
      });
   });
});
于 2012-05-15T07:56:43.127 回答
-1

您可以使用替换方法

$('#cl').click(function(){
        $('div').text($('div').text().replace('kamal',''));
});
于 2012-05-15T07:27:13.560 回答