js文字处理两端展示中间省略号
点击查看代码
function ellipsisText(longText, displayLength) {
// 确保显示长度至少包含省略号的3个字符
if (displayLength < 3) {
throw new Error('Display length should be at least 3 to accommodate ellipsis.');
}
// 计算两侧各应显示的字符数
const sideLength = Math.floor((displayLength - 3) / 2);
// 截取并拼接文本
let displayText = longText.slice(0, sideLength) + '...' + longText.slice(-sideLength);
// 如果原始文本长度小于等于要显示的长度,则直接返回原始文本
if (longText.length <= displayLength) {
return longText;
} else {
return displayText;
}
}
// 使用示例
const longText = "这是一段很长的文字,包含各种字符,英文、数字和中文……";
const displayLength = 20; // 两端各10个字符加上省略号
const result = ellipsisText(longText, displayLength);
console.log(result);
js文字处理两端展示中间省略号的更多相关文章
- js文字展示各种滚动效果
js文字展示各种滚动效果:http://www.dowebok.com/demo/188/
- CSS——div内文字的溢出部分用省略号显示
使得div内文字的溢出部分用省略号显示,可归纳为两种解决办法,一种方法是用CSS解决,另一种方法是js解决. 一.通过CSS控制显示 div内显示一行,超出部分用省略号显示 div内显示多行,超出部分 ...
- js文字向上滚动代码
js文字向上滚动代码 <style>.pczt_pingfen_jhxs_news1{ width:397px; background:#edfafd; padding-top:2px; ...
- js文字颜色闪烁
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- CSS控制文字,超出部分显示省略号
http://www.daqianduan.com/6179.html <p style="width: 300px;overflow: hidden;white-space: now ...
- textillate.js 文字动画
textillate.js是一款强大的文字插件,若配合animate.css.fittext.lettering一起使用,这样做出来的文字特效很完美. 在线实例 实例演示 使用方法 <div i ...
- Js文字特效—文字段逐个变色循环
自己用来练习的,附上详细注释,如果有和我一样喜欢并想要学习Dom特效创作的朋友,推荐先系统了解Javascript中Html Dom Object部分的内容,包括常用方法及属性. <!DOCTY ...
- js 文字预写匹配
效果图: demo如下: <!DOCTYPE html> <html> <head> <title>文字预写</title> </he ...
- html js文字左右滚动插件
自己写过很多插件,但都是直接嵌入在了工程里,从来没有拿出来单独封装成一个文件过,这是第一次,希望是一个良好的开端. 一个文字过长而可以左右滚动的插件 <!DOCTYPE html> < ...
- three.js 文字显示不出来
试了下使用three.js加载文字,首先是报了一个这样的错误: Cross origin requests are only supported for HTTP.” 当时很懵逼,去网上查了查,发现是 ...
随机推荐
- 小师妹学JavaIO之:文件写入那些事
目录 简介 字符输出和字节输出 格式化输出 输出其他对象 在特定的位置写入 给文件加锁 总结 简介 小师妹又对F师兄提了一大堆奇奇怪怪的需求,要格式化输出,要特定的编码输出,要自己定位输出,什么?还要 ...
- OpenHarmony 分布式硬件关键技术
本文转载自 OpenHarmony TSC 官方微信公众号<峰会回顾第8期 | OpenHarmony 分布式硬件关键技术> 演讲嘉宾 | 李 刚 回顾整理 | 廖 涛 排版校对 ...
- 《苏丹的复仇》携手华为HMS生态,实现用户、收入双增长
中国出海中东和北非地区的策略类手游<苏丹的复仇>(Revenge of Sultans,ROS)和华为HMS生态深度合作,为本地用户带来创新游戏体验,成为当地广受欢迎的游戏之一,下载量居应 ...
- C++ 获取数组大小、多维数组操作详解
获取数组的大小 要获取数组的大小,可以使用 sizeof() 运算符: 示例 int myNumbers[5] = {10, 20, 30, 40, 50}; cout << sizeof ...
- 史上最全的中高级JAVA工程师-面试题汇总
史上最全的中高级JAVA工程师-面试题汇总 置顶 2019-10-15 18:58:32 Jeff.Smile 阅读数 34460更多 分类专栏: # 随笔 版权声明:本文为博主原创文章,遵循CC 4 ...
- 把vim配置成顺手的python轻量级IDE(一)
把vim配置成顺手的python轻量级IDE(一) 地球的外星人君 Linux云计算和Python推动市场提升的学习研究者. 分享一篇文章,正好最近正在折腾VIM,原文在把vim配置成顺手的pytho ...
- mysql 必知必会整理—组合查询与全文搜索[九]
前言 简单整理一下组合查询与全文搜索. 正文 什么是组合查询,就是我们常说的交并补集. 直接上例子. 举一个例子,假如需要价格小于等于5的所有物品的一个列表,而且还想包括供应商1001和1002生产的 ...
- RestfulApi 学习笔记——内容协商(三)
前言 什么是内容协商呢?是这样的,我们在请求的时候都有两个属性,一个是Content-Type,另一个是accept,这两个什么意思呢? content-type 这个是表示自己传输的是什么内容,就像 ...
- Java进行excel的导入导出操作
excel表格的导出导入在业务中经常会遇到,下面介绍hutool和easyExcel两种操作excel的工具 测试的实体类 通过mybatis-plus生成的,用于导出数据的实体类 @Getter @ ...
- Bogus 实战:使用 Bogus 和 EFCore 生成模拟数据和种子数据【完整教程】
引言 上一章我们介绍了在xUnit单元测试中用xUnit.DependencyInject来使用依赖注入,上一章我们的Sample.Repository仓储层有一个批量注入的接口没有做单元测试,今天用 ...