jq中html函数的新用法

    <div class="container">test
        <div class="row">
          <div class="col-xs-2">col-md-2</div>
          <div class="col-xs-2">col-md-2</div>
          <div class="col-xs-2">col-md-2</div>
        </div>
    </div>

jq的html()和text()这两个方法大家都不陌生吧

不知道大家有没有遇到过这种情况，在上面的代码中，我想把<div class="container">后面的test这几个文字去掉，但是其余内容不变，要怎么改呢?

这个问题其实一直困扰着我，一般来说，我会给test外面套个span标签，然后再通过删除span标签里面的内容达到删除的目的，而不影响其余内容

但是能不能不加标签呢? $('.container').html($('.container').html().replace('test','')),这样也能实现

但是。。

    <div class="container">test
        <div class="row">
          <div class="col-xs-2">col-md-2</div>
          <div class="col-xs-2">col-md-2</div>
          <div class="col-xs-2">col-md-2</div>
        </div>
    </div>
    <div class="container">html
        <div class="row">
          <div class="col-xs-2">col-md-2</div>
          <div class="col-xs-2">col-md-2</div>
          <div class="col-xs-2">col-md-2</div>
        </div>
    </div>
    <div class="container">text
        <div class="row">
          <div class="col-xs-2">col-md-2</div>
          <div class="col-xs-2">col-md-2</div>
          <div class="col-xs-2">col-md-2</div>
        </div>
    </div>

如果是这种代码，就有些无能为力了

$.fn.text()和$.fn.html()都可以传递function作为参数写法为$div.html(function(index, value))

第一个参数是索引，第二个参数是html或text的原值

this是指向元素集合中的当前元素

贴一下代码吧

$('.container').html(function(i,old){
    return old.replace($(this).text().split('\n')[0],'');
});

$(this).text()这个返回值是一个字符串，由于我们的标签之间会有换行，所以我split的时候用了\n(这个地方有点不太好，有空改进一下)