JS实现多行文本最后是省略号紧随其后还有个超链接在同一行的需求
1、布局及样式如下图:
2、js获得上图的div对象,然后判断div对象的高度,如果大于一行的高度了表示内容有两行了,再获得span标签里面的内容并用正则将后六个字符替换成“......”这里的实现代码可以这样写span.innerHTML = span.innerHTML.replace(/.(\.\.\.\.\.\.)?$/,"......");然后再将a链接的display属性设置为a.style.display="";将a超链接显示出来即可。
JS实现多行文本最后是省略号紧随其后还有个超链接在同一行的需求的更多相关文章
- CSS和JS实现单行、多行文本溢出显示省略号(该js方法有问题不对)
如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...
- CSS实现单行、多行文本溢出显示省略号(…)
如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...
- 布局常见问题之css实现多行文本溢出显示省略号(…)全攻略
省略号在ie中可以使用text-overflow:ellipsis了,但有很多的浏览器都需要固定宽度了,同时ff这些浏览器并不支持text-overflow:ellipsis设置了,下文来给各位整理一 ...
- CSS单行、多行文本溢出显示省略号(……)
这个问题经常遇到 1.单行文本溢出显示省略号(…) text-overflow:ellipsis-----部分浏览器还需要加宽度width属性 overflow:hidden;text-overflo ...
- css实现多行文本溢出显示省略号(…)全攻略
省略号在ie中可以使用text-overflow:ellipsis了,但有很多的浏览器都需要固定宽度了,同时ff这些浏览器并不支持text-overflow:ellipsis设置了,下文来给各位整理一 ...
- CSS单行、多行文本溢出显示省略号
如果实现单行文本的溢出显示省略号小伙伴们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; t ...
- CSS 实现单、多行文本溢出显示省略号(…)
如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽度width属来兼容部分浏览. 实现方法: overflow: hidden; te ...
- CSS单行、多行文本溢出显示省略号(……)解决方案
单行文本溢出显示省略号(-) text-overflow:ellipsis-----部分浏览器还需要加宽度width属性 .ellipsis{ overflow: hidden; text-overf ...
- CSS 单行 多行文本溢出显示省略号
单行文本 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; 多行文本溢出显示省略号: <style type=&quo ...
随机推荐
- 【JQuery】jQuery中的常用方法小结
1.层级选择器 后代选择器 "父元素 后代元素" 比如:$("div p") 选取div元素下所有的p元素 子元素选择器 "父元 ...
- Haproxy TCP数据转发
在实际项目中需要用到haproxy做TCP转发,下面主要针对haproxy的安装及TCP数据转发配置进行说明 一.安装Haproxy (1)编译安装Haproxy mkdir -p /data01/h ...
- MS SQL Server查询优化方法 查询速度慢的原因很多,常见如下几种
1.没有索引或者没有用到索引(这是查询慢最常见的问题,是程序设计的缺陷) 2.I/O吞吐量小,形成了瓶颈效应. 3.没有创建计算列导致查询不优化. 4.内存不足 5.网络速度慢 6.查询出的数据量过大 ...
- MongoDB----逻辑与物理存储结构
基本的操作 一.常用的命令和基础知识 1.进入MongoDB shell 首先我们进入到MongoDB所在目录执行 cd /work/app/mongodb/bin/ #启动 ./mongo 为了方便 ...
- linux文件系统 - 初始化(二)
加载initrd(上) 一.目的 本文主要讲述linux3.10文件系统初始化过程的第二阶段:加载initrd. initrd是一个临时文件系统,由bootload负责加载到内存中,里面包含了基本的可 ...
- 带你开发一款给Apk中自己主动注入代码工具icodetools(开凿篇)
一.前言 从这篇開始咋们開始一个全新的静态方式逆向工具icodetools的实现过程.这个也是我自己第一次写的个人认为比較实用的小工具,特别是在静态方式逆向apk找关键点的时候.兴许会分为三篇来具体介 ...
- 10.翻译:EF基础系列---EF中的持久性
原文链接:http://www.entityframeworktutorial.net/EntityFramework4.3/persistence-in-entity-framework.aspx ...
- android发送短信代码(短信内容超长处理)
一条短信只可容纳70个中文,所以当短信长度超过70个中文字符时程序就要特殊处理了. 有两种方式: 1.通过sendTextMessage()方法依次发送拆分后的短信,该方式有个弊端就是用户会分条收到短 ...
- How to compare dates in Java
How to compare dates in JavaBy mkyong | January 18, 2010 | Updated : November 15, 2016 | Viewed : 93 ...
- Python selenium 滚动条 详解
在我们使用Python + selenium 爬虫的时候,会遇到如下报错,原因是 当页面上的元素超过一屏后,想操作屏幕下方的元素,是不能直接定位到,会报元素不可见的. selenium.common ...