首页 > 其他分享 >js文字处理两端展示中间省略号

js文字处理两端展示中间省略号

时间:2024-02-20 17:02:45浏览次数:25  
标签:displayLength 文字处理 省略号 longText sideLength 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);

标签:displayLength,文字处理,省略号,longText,sideLength,js,文本
From: https://www.cnblogs.com/zsnhweb/p/18023518

相关文章

  • threejs 如何设置自己想要的初始角度和大小
    threejs在渲染完模型后,一般初始的大小和角度并不合我们的心意,这就需要我们手动调整了,但是手动调整又不好控制精度。  开启相机控件threejs渲染的模型大小和角度是由相机决定的,所以我们只需要调整相机就可以了,然后获取相机位置信息写入到初始化的数据中就可以了。要调整相......
  • OpenHarmony JS和TS三方组件使用指导
    OpenHarmonyJS和TS三方组件介绍OpenHarmonyJS和TS三方组件使用的是OpenHarmony静态共享包,即HAR(HarmonyArchive),可以包含js/ts代码、c++库、资源和配置文件。通过HAR,可以实现多个模块或者多个工程共享ArkUI组件、资源等相关代码。HAR不同于HAP,不能独立安装运行在设备上,只能作......
  • C#调用JS实现
    在做Unity转换微信小程序的时候,由于微信小程序内使用的语言为js,Unity内使用的是C#,所以在一些场景中会有C#调用js的情况出现。创建.jslib文件创建文本文档或其他,文件名根据自己需要,将文件后缀名改为.jslib。mylib.jslib文件内容为:varMyLib={TestNormal:function(val)......
  • CentOS7安装nodejs18
    CentOS7安装nodejs18及以上版本会报错,glibc版本过低。升级glibc到2.28。查看glibc版本号#ldd--version1、下载glibc2.28并创建build目录cdwgethttp://ftp.gnu.org/gnu/glibc/glibc-2.28.tar.gztarxfglibc-2.28.tar.gzcdglibc-2.28/mkdirbuild2、升级gccyuminstall-y......
  • Vue.JS:使用Vite工具创建项目 及 后续的主要配置
    原文地址:https://mp.weixin.qq.com/s/QelQEAMYSoNC0uYKfbO9Gw01 使用Vite工具创建Vue.JS项目 命令:npmcreatevite@latest 首先,要提供的是你项目的名称: 然后,选择一个框架:这一段的全部代码如下:adamhuan@192PycharmProjects%pwd/Users/adamhuan/PycharmProjectsad......
  • 解锁Mysql中的JSON数据类型,怎一个爽字了得
    引言在实际业务开发中,随着业务的变化,数据的复杂性和多样性不断增加。传统的关系型数据库模型在这种情况下会显得受限,因为它们需要预先定义严格的数据模式,并且通常只能存储具有相同结构的数据。而面对非结构化或半结构化数据的存储和处理需求,选择使用非关系型数据库或者创建子表存......
  • JS-SDK 配置,实现微信分享功能
    官方文档:https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html在使用微信分享功能之前,需要进行如下配置,参考官方文档1.绑定域名此处看官方文档2.引入JS文件此处看官方文档3.通过config接口注入权限验证配置这里进行步骤分解3.1调用后端签名接口......
  • 安装Node.js和npm
    由于需要Node.js平台运行JavaScript代码,所以必须首先在本机安装Node环境。安装Node.js目前Node.js的最新版本是21.11.1。首先,从Node.js官网下载对应平台的安装程序。在Windows上安装时务必选择全部组件,包括勾选AddtoPath。安装完成后,在Windows环境下,请打开命令提示符,然后输......
  • .NET配置文件大揭秘:轻松读取JSON、XML、INI和环境变量
     概述:.NET中的IConfiguration接口提供了一种多源读取配置信息的灵活机制,包括JSON、XML、INI文件和环境变量。通过示例,清晰演示了从这些不同源中读取配置的方法,使配置获取变得方便且易于扩展。这种方式适用于不同场景,如API密钥、数据库连接等,为应用提供了高度可配置性。在.NET......
  • 学习总结基于VUE+ASP.NET Core mvc+EFCore+Axios.js+ehcart.js开发一个web应用
    Vue是一个用于构建用户界面(基于数据渲染出用户看到的页面)的渐进式(循序渐进)框架。分为(声明式渲染,基于js包、组建系统、客户端路由、大规模状态管理和构建工具)Vue的使用方法分为:1.Vue核心包开发:局部模块改造;2.Vue核心包+Vue插件工程化开发:整站开发1.开始之前准备下述包 在prog......