js实现文字截断功能

来源:爱站网时间:2020-04-15编辑:网友分享
在建立网站的时候,经常要截断文字,有时候我们处理这种情况通过使用“…”符号进行表示,当然实现截断还可以有很多方法,下面是爱站技术频道给大家带来的js实现文字截断功能的介绍,一起进入下文学习一下吧!

在建立网站的时候,经常要截断文字,有时候我们处理这种情况通过使用“…”符号进行表示,当然实现截断还可以有很多方法,下面是爱站技术频道给大家带来的js实现文字截断功能的介绍,一起进入下文学习一下吧!

先前用jq做了一个文字截断功能,但是不用jq的项目要实现此功能还要引如jq显得过于麻烦。这里写了一个js的文字截断功能。直接上代码。 

HTML(测试用的): 

我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox
我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox
我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox
我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox
我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox
我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox
我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox
我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox我是pox

JS: 

var limit=[];
    var Text=[];
    var Pox=document.getElementsByTagName('*');
    for(var i=0;i

这里用getElementsByTagName获取所有节点遍历,if(Pox[i].getAttribute("limit"))筛选含有limit这个自定义属性的节点,然后获取各个节点自定义属性limit的值,将其放入limit数组中,把各个节点文字放入Text数组中,将需要截断的值和文本长度作比较,进行截断。 

全部JS,这里写的自调:

效果图:

js实现文字截断功能的全部内容就爱站技术频道就给大家分享到这里了,如果大家还有什么方法,记得给我们留言,或者关注js.aizhan.com哦!

上一篇:浅谈Node.js之异步流控制

下一篇:Angular 应用技巧总结

您可能感兴趣的文章

相关阅读

热门软件源码

最新软件源码下载