• 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('
    ')[0],'');
    });
    $(this).text()这个返回值是一个字符串,由于我们的标签之间会有换行,所以我split的时候用了
    (这个地方有点不太好,有空改进一下)


  • 相关阅读:
    css3正方体效果
    单行文本溢出和多行文本溢出变省略号
    iscroll的滑动效果
    angular笔记
    html页面的css样式、meta最常用的最基本最常规的配置参数
    解决webstorm卡顿问题
    pc端网页的设计尺寸
    时间字符串解析成日期时间格式
    Inf2Cat, signability test failed.
    #pragma once 与 #ifndef 解析(转载)
  • 原文地址:https://www.cnblogs.com/DonaldTrump/p/6274809.html
Copyright © 2020-2023  润新知