1、布局及样式如下图：

2、js获得上图的div对象，然后判断div对象的高度，如果大于一行的高度了表示内容有两行了，再获得span标签里面的内容并用正则将后六个字符替换成“......”这里的实现代码可以这样写span.innerHTML = span.innerHTML.replace(/.(\.\.\.\.\.\.)?$/,"......");然后再将a链接的display属性设置为a.style.display="";将a超链接显示出来即可。

JS实现多行文本最后是省略号紧随其后还有个超链接在同一行的需求的更多相关文章

  1. CSS和JS实现单行、多行文本溢出显示省略号（该js方法有问题不对）

    如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...

  2. CSS实现单行、多行文本溢出显示省略号（…）

    如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...

  3. 布局常见问题之css实现多行文本溢出显示省略号(…)全攻略

    省略号在ie中可以使用text-overflow:ellipsis了,但有很多的浏览器都需要固定宽度了,同时ff这些浏览器并不支持text-overflow:ellipsis设置了,下文来给各位整理一 ...

  4. CSS单行、多行文本溢出显示省略号（……）

    这个问题经常遇到 1.单行文本溢出显示省略号(…) text-overflow:ellipsis-----部分浏览器还需要加宽度width属性 overflow:hidden;text-overflo ...

  5. css实现多行文本溢出显示省略号(…)全攻略

    省略号在ie中可以使用text-overflow:ellipsis了,但有很多的浏览器都需要固定宽度了,同时ff这些浏览器并不支持text-overflow:ellipsis设置了,下文来给各位整理一 ...

  6. CSS单行、多行文本溢出显示省略号

    如果实现单行文本的溢出显示省略号小伙伴们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; t ...

  7. CSS 实现单、多行文本溢出显示省略号（…）

    如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...

  8. CSS单行、多行文本溢出显示省略号（……）解决方案

    单行文本溢出显示省略号(-) text-overflow:ellipsis-----部分浏览器还需要加宽度width属性 .ellipsis{ overflow: hidden; text-overf ...

  9. CSS 单行 多行文本溢出显示省略号

    单行文本 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; 多行文本溢出显示省略号: <style type=&quo ...

随机推荐

  1. 16条Android开发小经验

    1. TextView中的getTextSize返回值是以像素(px)为单位的, 而setTextSize()是以sp为单位的. 所以如果直接用返回的值来设置会出错,解决办法是 用setTextSiz ...

  2. mysql常用查询语句

    一.查询指定schema下表的个数 select count(TABLE_NAME) from information_schema.tables where table_schema="d ...

  3. Oracle中文乱码解决办法总结

    AMERICAN_AMERICA.WE8ISO8859P1,这个字符编码是西欧字符编码,对应于.Net的就是iso-8859-1字符编码,所以只需要改到系统的默认字符编码就行了. 解决方法: (1) ...

  4. Sql Server Compact 4.0数据库部署安装

    Sql Server Compact 4.0相比3.5版本增强了很多,支持Entity Framework 4.1,对于轻量级应用来讲,使用Sql Server Compact 4.0是个很好的选择, ...

  5. jmeter Best Practices

    性能测试最佳实践之JMeter 16. Best Practices 16.1 Always use latest version of JMeter The performance of JMete ...

  6. 基础003_V7-Memory Resources

    一.综述 参考ug473.pdf. 常用Memory 资源: 在IP核中,Block memory(distributed memory为CLB中的资源): 通常选用Native,而不用AXI接口: ...

  7. 【python】pycharm常用配置快速入门。

    俗话说,工欲善其事必先利其器.当我们想从事一门新的语言的时候,最重要的是熟悉其常用的编辑器的配置.刚好这两天在学习python,网上看到一篇比较好的文章,转载过来自己学习一下.感谢:https://s ...

  8. centos安装Elasticsearch步骤

    1.安装JDK:centos删除openJDK,安装JDK,vim /etc/profile配置JAVA_HOME 2.官网下载elasticsearch:https://www.elastic.co ...

  9. WPF 控件事件的一个小坑…

    最近想判断一下 Slider 是由鼠标点击而改变值,还是由程序内部代码改变的值,发现鼠标的各种事件比如 MouseDown.MouseUp.MouseLeftButtonDown 什么的,都没有任何反 ...

  10. vivado 的调试工具ILA抓到的波形可以保存

    Vivado下debug后的波形通过图形化界面并不能保存抓取到波形,保存按钮只是保存波形配置,如果需要保存波形需要通过TCL命令来实现: write_hw_ila_data0730_ila_1 [up ...