在 Javascript 中使字符串的一部分变为粗体答案

【问题标题】：Make part of a string bold in Javascript在 Javascript 中使字符串的一部分变为粗体
【发布时间】：2021-06-26 21:33:02
【问题描述】：

我见过很多人问这个问题，但我似乎从来没有找到一个简单直接的答案。我正在使用 Vue，并且在一个组件中我正在显示来自对象的文本。我想以粗体显示指定价格的文本，但保留文本的其余部分。如何使字符串的这个特定部分变为粗体？

premiumContent: [
    {
       infoText: "Get this for only €2,99 per month:",
    },
]

【问题讨论】：

@tony19 有正确答案，无论如何，如果您无法更改来自 API 的内容，您可以使用带有特定正则表达式的 filters 找到第一个 € 字符，添加 <b> in它的前面和数字之后，并按照@tony19 的建议继续，使用v-html="inforText | filter"
如果信息文本始终采用这种形式，您可以用空格array.split(" ") 分割字符串，第四个索引将始终是价格，然后只需操作包含字符串 $2 的数组 [4]， 99
@Omar 好主意！更好的是，从欧元符号开始直到找到空格，或者只需编写一个小正则表达式即可根据货币（usd、eur 等）找到它。

标签： javascript vue.js ecmascript-6 vuejs2

【解决方案1】：

如果你可以编辑infoText，请用<b> tags包围价格：

export default {
  data() {
    return {
      premiumContent: [
        {
          infoText: "Get this for only <b>€2,99</b> per month:",
        },
      ]
    }
  }
}

然后使用v-html directive将其插入元素的innerHTML：

<div v-for="content of premiumContent"
     v-html="content.infoText">
</div>

demo

【讨论】：

我猜他的问题是在字符串中找到价格，然后更新它。
这是可能的，但 OP 应该在问题中澄清这个细节。 :)