在jquery中使用remove()删除任何单词

时间:2012-05-15 07:24:21

标签: jquery

你好朋友我想创建一个删除内容中任何特定单词的函数

我有这个代码

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你还可以看到我的代码的在线演示here

请帮帮我

提前致谢:)

7 个答案:

答案 0 :(得分: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(),并简化代码逻辑。

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

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

var re = /kamal/gi;

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

请参阅http://jsfiddle.net/alnitak/eVUd3/

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

答案 1 :(得分: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>

编辑:使用全局正则表达式替换更改了简单字符串替换,因此只需单击一次即可替换所有实例。 有关工作示例,请参阅http://jsfiddle.net/kamui/U7PT3/3/

编辑:基于来自@Alnitak的评论是正确的,注意到以前版本的代码删除了包含文本的整个子元素而不仅仅是文本,新的更新版本不会中断DOM并删除关键字“kamal”的所有实例请参阅更新的jsfiddle http://jsfiddle.net/kamui/U7PT3/6/

答案 2 :(得分:1)

var $div = $('div');
$div.text($div.text().replace('yourword', ''))

答案 3 :(得分:0)

remove函数不仅从DOM中删除节点

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

编辑:这个正在运作

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

http://jsfiddle.net/qH4CJ/

答案 4 :(得分:0)

使用此:

 $('#cl').click(function(){
        $('div').each(function(){
            $(this).text($(this).text().replace(/kamal/g, '');
          });
 });

答案 5 :(得分:0)

由于text()获取值,而text(“someValue”)设置值,因此只需将一个放在另一个内。 这应该对你有用

http://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);
      });
});

});

答案 6 :(得分:-1)

您可以使用替换方法

$('#cl').click(function(){
        $('div').text($('div').text().replace('kamal',''));
});