js限制文字字数,超出用省略号......表示

本文介绍了一个基于jQuery实现的文本截断示例,当文本长度超过设定值时,多余部分用省略号代替,展示了HTML、CSS及JS的具体实现。

此方法基于jquery,不要忘记引入jQuery文件哦!!!

看代码:

html部分:

<div class="myTit">在很久很久以前,有一个古老又神秘的家族,他们有雪白的羽毛,无翅而能在空中飞翔.在很久很久以前,有一个个古老又神秘的家族,他们有雪白的羽毛,无翅而能在空中飞翔</div>

css部分:

.myTit {
            width:300px;
            line-height: 20px;
            font-size: 14px;
            background: lightblue;
            color:#333;
            padding:20px;
}

js部分:

$(".myTit").each(function(){
       var len=$(this).text().length;   //当前HTML对象text的长度
       if(len>30){
           var str="";
           str=$(this).text().substring(0,30)+"......";  //使用字符串截取,获取前30个字符,多余的字符使用“......”代替
           $(this).html(str);                   //将替换的值赋值给当前对象
       }
    });

最终效果:

评论 7
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值