/**
* 根据指定宽度截取字符串
* @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. 过河卒(NOIP2002)

    题目链接:过河卒 直接模拟?会T掉60分. 所以我们可以采用递推,怎么想到的? 因为卒子只能向下或向右走,所以走到一个点的方法数,等于走到它上面点的方法数加上走到它左边点的方法数,这样就可以地推了. ...

  2. python学习 day19 (3月26日)----(对象组合)

    深谙:非常透彻地了解:熟悉内中情形.谙,读作‘ān’ 熟悉. 1.面向对象作用:规划了代码中的函数处理的是哪一类问题 解决了传参的问题 方便扩展 方便重用 2.类的定义和使用类当中有哪些成员 ''' ...

  3. Django的学习(五)————实战问题

    一.多参数问题: 首先是在添加一个新的参数,其次在url中把这个id传递过去 def article_page(request, article_id): article = models.Artic ...

  4. python递归和二分法

    一.递归 1.递归就是自己调用自己 def fn(n): print(n) fn(n+1) fn(1) #递归深度官方1000 一般都递归到998 2.树形结构的遍历 import os def fn ...

  5. 移动构造函数(c++11)

    1.概念 1)C++中对象发生拷贝的场景可以分为两种,一种是被拷贝的对象还要继续使用,另一种是被拷贝的对象不再使用:第二种一般可以认为是对右值的拷贝 2)C++11中引入了移动构造函数,对象发生拷贝时 ...

  6. c# 产生随机数 程序所在路径

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  7. castapp.js颜色配置

    1  修改head的背颜色 (1) header添加class  publicHead <header class="mui-bar mui-bar-nav publicHead&qu ...

  8. noip第19课作业

    1. 谁考了第K名 在一次考试中,每个学生的成绩都不相同,现知道了每个学生的学号和成绩,求考第k名学生的学号和成绩. [输入格式] 第一行有两个整数,分别是学生的人数n(1<=n<=100 ...

  9. python的打开_记录

    1. 2.7版本,安装了2.7,可以在命令符里面输入cmd,然后输入python,进入python的工作环境. 2. 3.6版本 ,anaconda版本,在F:\qhpython里边找到python. ...

  10. 关于Servlet中GET和POST方法的总结

    JSP.Servlet中get请求和post请求的区别总结   在学习JavaWeb最初的开始阶段,大家都会遇到HttpServlet中的doGet和doPost方法.关于Servlet中get请求和 ...