/**
* 根据指定宽度截取字符串
* @param desc 原始字符串
* @param width 该显示的宽度
* @param fontsize 字体大小 12px
* @returns {string} 截取后的字符串
*/
export function getStrByWith (desc, width, fontsize) {
var span = document.createElement('span')
span.id = 'cut'
span.style.visibility = 'hidden'
span.style.fontSize = fontsize
span.style.whiteSpace = 'nowrap'
document.body.appendChild(span)
var boo = false
var temp = '' // 存放截断字符串
for (var j = 0; j < desc.length; j++) {
// desc是目标字符串,
temp += desc[j]
span.innerText = temp
if (span.offsetWidth > width) {
boo = true
break
}
}
document.body.removeChild(span)
if (boo) temp += '..'
return temp
}

[JavaScript] 根据指定宽度截取字符串的更多相关文章

  1. [JavaScript] 根据字符串宽度截取字符串

    /** * 根据字符串宽度截取字符串 * @param desc 原始字符串 * @param width 该显示的宽度 * @param fontsize 字体大小 12px * @returns ...

  2. javascript 高效按字节截取字符串

    做为一个前端开发人员在网页展示中经常会碰到,标题过长,需要截取字符串,用CSS的实现的话各种兼容问题,各种坑. 让后台程序截一下,又各种推托,让后台按字节截一下更是和要了后台老命一样,最后可能只会安字 ...

  3. Android(Java) 字符串的常用操作,获取指定字符出现的次数,根据指定字符截取字符串

    /*这是第100000份数据,要截取出100000*/ String s="这是第100000份数据"; String s1 = s.substring(s.indexOf(&qu ...

  4. JavaScript:在JS中截取字符串的方法

    这篇主要说一说截取字符串的方法,用于帮助自己缕清方法的作用,参数的意义,返回值,是否对于原来的字符串进行了操作等. 在javascript中,常见的截取字符串的方法有slice().substring ...

  5. JavaScript进阶(七)JS截取字符串substr 和 substring方法的区别

    JS截取字符串substr 和 substring方法的区别 substr方法 返回一个从指定位置开始的指定长度的子字符串. stringvar.substr(start [, length ]) 参 ...

  6. C#指定长度截取字符串 并进行拼接。

    需求:有一个字符串需要按照指定长度拆分出来,然后在增加一个字符串拼接上. /// <summary> /// 字符串截取并拼接 /// </summary> /// <p ...

  7. python按照指定字符或者长度 截取字符串

    1.截取指定位置字符串 Python字符串可以理解为一个数组,获取某一部分的可以使用 str[beginIndex:endPosition],其中str为需要截取的字符串,beginIndex为需要截 ...

  8. 步步为营-104-SQL语句(截取字符串)

    按照指定字符截取字符串,截取出300 业务需求:想比对图片中框线部分是否一致 第一步 从最后一个/截取到末尾 select top 1 reverse(substring(reverse(Proces ...

  9. php截取字符串|php截取字符串前几位|php截取中文字符串

    转 截取字符串专题:php截取字符串函数,php 字符串长度,php截取字符串前几位 PHP截取中文字符串(mb_substr)和获取中文 => http://www.q3060.com/lis ...

随机推荐

  1. hdu6069 多校Counting Divisors

    思路:对于n^k其实就是每个因子的个数乘了一个K.然后现在就变成了求每个数的每个质因子有多少个,但是比赛的时候只想到sqrt(n)的分解方法,总复杂度爆炸,就一直没过去,然后赛后看官方题解感觉好妙啊! ...

  2. 关于Rigidbody,Collider和CharacterController三者之间的关系和用法的总结

    Rigidbody:多用在“物体”上,因为“物体”都是“死”的,他们的运动一般都是靠物理系统.所以对于Rigidbody的移动,不要用Translate(),要用各种“力”, 比如:Rigidbody ...

  3. 59.加载Viewcontroller的几种方法(添加导航,解决xib里面空间不显示问题)

    // 一.根据StoryboardID(需要在Storyboard设置),通过ViewController所在的Storyboard来加载: UIStoryboard *storyboard = [U ...

  4. samba服务和nginx服务

    一  samba服务 1 samba的功能:samba是一个网络服务器,是连接linux和windows之间共享文件的. 2 samba服务的启动,停止和重启: (1) 要启动Samba服务,只需用户 ...

  5. 2018.10.30 NOIP模拟 排列树(树形dp+组合数学)

    传送门 考试的时候乱搞过了. 其实题目就是让你求拓扑排序方案数. 直接树形dpdpdp然后组合数转移一下就行了. 乱搞代码

  6. git安装项目步骤

    1.git clone git@gitee(github).com:项目地址.git 2.cd 项目根目录 3.composer install 4.如果需要数据迁移,cmd中到项目根目录 php a ...

  7. idea环境下js、css中文乱码

    idea2018.2+tomcat8+java8+win10 异常:本地js和css通过tomcat发布时,在页面打印出的中文是乱码.而从数据库读取的中文数据和html的中文显示正常. 解决方法: 步 ...

  8. xml 转 数组

    function xml_to_array($xml){ if(!$xml){ return false; } //将XML转为array //禁止引用外部xml实体 libxml_disable_e ...

  9. java 后台 post请求 携带参数 远程操作 调用接口

    package com.huayu.tizong.matchteam.util; import java.io.BufferedReader; import java.io.IOException; ...

  10. poj-3067(树状数组)

    题目链接:传送门 题意:日本有东城m个城市,西城m个城市,东城与西城相互连线架桥,判断这些桥相交的次数. 思路:两个直线相交就是(x1-x2)*(y1-y2)<0,所以,对x,y进行排序,按照x ...