在前端开发中，经常会遇到需要截断文本并添加省略号的需求。为了方便处理这类需求，我们可以使用 ellipsus 这个 npm 包。本文将详细介绍 ellipsus 的使用方法和注意事项，帮助新手快速上手。
安装
使用 ellipsus 需要先安装它，可以通过 npm 进行安装：
--- ------- -------- ------
安装完成后，我们就可以在项目中使用 ellipsus 了。
API
ellipsus 有以下两个 API：
ellipsus(text, maxLength, options)
这个方法是 ellipsus 的主要方法，用于截断文本并添加省略号。
text：需要截断的文本。maxLength：文本的最大长度，超过这个长度的部分将被截断。options：可选参数，可以指定省略号的样式等。以下是可用的选项：ellipsis：省略号的样式，默认为三个点号（'...'）。wordBoundaries：是否考虑单词边界进行截断，默认为false。fixed：是否将省略号计算在最大长度之内，默认为false。
该方法返回截断后的文本。
ellipsus.truncateElement(element, maxLength, options)
这个方法是在某个元素内截断文本，并添加省略号。
element：需要截断文本的元素。maxLength：文本的最大长度。options：可选参数，同ellipsus方法的options。
该方法没有返回值，而是在元素中修改文本内容。
使用示例
ellipsus(text, maxLength)
假设我们有这样一个文本：
---- -------------------------------------
如果我们想要截取前 10 个字符并添加省略号，可以这样使用 ellipsus：
------ -------- ---- ----------- ----- ------ - -------------------------------- ----- ---- - ------------------- ----- ------------- - -------------- ---- ------------------ - --------------
截取后的文本为：
--------------
ellipsus(text, maxLength, options)
如果我们希望省略号的样式不是三个点号，而是两个点号，可以这样使用 ellipsus：
----- ------ - -------------------------------- ----- ---- - ------------------- ----- ------- - - --------- ---- -- ----- ------------- - -------------- --- --------- ------------------ - --------------
截取后的文本为：
-------------
ellipsus.truncateElement(element, maxLength)
如果我们直接想在元素中修改文本内容并添加省略号，可以这样使用 ellipsus.truncateElement：
------ -------- ---- ----------- ----- ------ - -------------------------------- ----- --------- - --- ----- ------- - - --------------- ---- -- -------------------------------- ---------- ---------
元素的内容将变为：
----------
总结
使用 ellipsus 可以方便地截断文本并添加省略号。在使用时需要注意的是，maxLength 指的是文本长度，而不是字符的数量；省略号的长度也需要计算在内，可以通过设置 fixed 选项来控制。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60056cc081e8991b448e63b6