如何在JavaScript中标记字符串中长度超4字符的单词并保留特殊字符

我明白你的痛点——用普通的split方法拆分字符串总会破坏原有的标点、HTML标签等特殊字符结构，要么把单词和符号粘在一起，要么拼接时丢东西。其实不用拆分拼接这么麻烦，直接用正则表达式匹配单词并替换就完美解决了！

核心思路是：用正则精准识别出真正的单词（包括带撇号、连字符的合法单词），然后只对符合长度要求的单词做加粗处理，周围的特殊字符会自动保留在原位，完全不用手动处理拆分和拼接的问题。

示例代码 #

// 从数据库获取的原始字符串
const dbString = "Hello World,<br/>it's a beautiful day! Let's try this long-word-example?";

// 正则匹配单词：支持包含撇号、连字符的单词，可根据你的需求调整字符范围
const wordRegex = /\b[\w'-]+\b/g;

// 处理加粗逻辑
const processedString = dbString.replace(wordRegex, (word) => {
  // 只对长度超过4的单词加粗（即5个字符及以上）
  return word.length > 4 ? `**${word}**` : word;
});

console.log(processedString);

效果说明 #

运行上面的代码后，输出结果会是：
**Hello** **World**,<br/>it's a **beautiful** day! **Let's** try this **long-word-example**?

可以看到：

• 所有长度超4的单词都被正确加粗了
• 逗号、<br/>标签、感叹号这些特殊字符完全保留了原来的位置和格式
• 像it's（长度4）、try（长度3）这类短单词没有被处理
• 连字符连接的long-word-example被当成一个完整单词处理（如果不需要这个效果，把正则里的-去掉即可）

灵活调整 #

如果你的场景是在HTML页面中展示（而不是Markdown），只需要把加粗的标记换成HTML标签：

return word.length > 4 ? `<strong>${word}</strong>` : word;

这样处理就完全避开了拆分字符串带来的各种问题，既精准又省心！

内容的提问来源于stack exchange，提问作者Tenarius