有个需求是期望把一段文字想歌词那样换行显示。目前粗略方式，就是遇到标点符号进行换行效果。
网上找了解决方案，有以下两种。按照我的诉求，采用了第二种。
示例代码：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
</head>
<body>
<script type="text/javascript">
// 示例1：来源于百度的ai智能回答
function wrapTextAtPunctuation(text) {
// 正则表达式匹配常见的标点符号
const pattern = /[。！？；,.!?;]/;
// 使用split分割文本，并在每个标点符号处拆分
let wrappedText = text.split(pattern).map((segment, index) => {
// 如果这不是最后一个段落，并且段落不为空
if (index < text.length - 1 && segment) {
// 在段落末尾添加换行符
return segment + '\n';
}
return segment;
}).join('');
return wrappedText;
}
// 示例1：标点符号没有了
const text = "这是一段示例文本。这是下一句。又一段新文本！最后一句问题？";
const wrappedText = wrapTextAtPunctuation(text);
console.log(wrappedText);
// 示例2：来源于参考文章2
function Fun2(text) {
// 正则表达式匹配常见的标点符号，g代表全局匹配
const pattern = /[。！？；,.!?;]/g;
let text_ = text.replace(pattern, '$&\n'); // $&代表匹配到的字符本身，\n是换行符
return text_;
}
// 示例2：保留原来的标点符号
console.log('Fun2:::', Fun2(text));
</script>
</body>
</html>
参考文章：
-
百度ai智能：
image.png 微信小程序：js处理一段文字，根据句号或者分号进行换行https://blog.csdn.net/weixin_46001736/article/details/134054345
