javascript中的拆分数字，以不同字体大小显示小数点后和小数点前的数字

我有一个计划页面向我的客户展示我的网站产品的3个计划-基本、高级和VIP，所有计划都有每月和每年的价格

我从后端为美国和印度的

$products

获取以下值，该产品仅在这两个国家/地区提供。因此，根据选择的国家/地区，我会显示客户的价格

退回美国的产品：

$products = [
          {
            monthly_price => "\$5.95”,
            yearly_price => "\$40.95",
            type => "basic"
          },
          {
            monthly_price => "\$10.95”,
            yearly_price => "\$80.95",
            type => "premium"
          },
          {
            monthly_price => "\$15.95”,
            yearly_price => "\$120.95",
            type => "vip"
          },
]

为IND退回的产品：

$products = [
          {
            monthly_price => "\₹200.55",
            yearly_price => "\₹2500.55”,
            type => "basic"
          },
          {
            monthly_price => "\₹400.55",
            yearly_price => "\₹5000.55”,
            type => "premium"
          },
          {
            monthly_price => "\₹800.55",
            yearly_price => "\₹1000.55”,
            type => "vip"
          },
        ];

以下是CSS文件：

.main-price {
   font-size: 45px;
}

.decimal-price {
   font-size: 15px;
}

.term {
   font-size: 15px;
}

Main和decimalprice有不同的CSS，我使用了下面的类。所以我在点（.）后面拆分，它将是2个值。因此，我按照.1和.2来做

以下是HTML文件：

[% FOR price in products -%]
    [% monthly_price = price.monthly_price.split('.') %]
    [% yearly_price = price.yearly_price.split('.') %]
    <h1>[% price.type.uc %]</h1>
    <p>
        <span class="main-price">[% monthly_price.1 %]</span>
        <span class="decimal-price">[% monthly_price.2 %]</span>
        <span class="term">per month</span>
    </p>
    <p>
        <span class="main-price">[% yearly_price.1 %]</span>
        <span class="decimal-price">[% yearly_price.2 %]</span>
        <span class="term">per year</span>
    </p>
[%- END %]

• 解决方案2：

• 解决方案3：

预期：

• 我想用45px字体显示主要价格，用15px字体显示十进制价格/条款

问题:

• 未显示主价格和十进制价格

谁能帮我一下我哪里出了问题

---

提前感谢

我正在签入javascript。很好用。但您的代码不是纯javascript。所以，我不知道这种代码

检查是否有split（）支持

var乘积=[
{
月价：\$5.95“，
年价格：\$40.95“，
类型：“基本”
},
{
月价：\$10.95“，
年价格：\$80.95“，
类型：“高级”
},
{
月价：\$15.95“，
年价格：\$120.95“，
类型：“vip”
},
]
products.forEach（价格=>{
var res=价格.月度价格.分割（'.'）；
console.log（res[0]）；
console.log（res[1]）；
});

我正在签入javascript。很好用。但您的代码不是纯javascript。所以，我不知道这种代码

检查是否有split（）支持

var乘积=[
{
月价：\$5.95“，
年价格：\$40.95“，
类型：“基本”
},
{
月价：\$10.95“，
年价格：\$80.95“，
类型：“高级”
},
{
月价：\$15.95“，
年价格：\$120.95“，
类型：“vip”
},
]
products.forEach（价格=>{
var res=价格.月度价格.分割（'.'）；
console.log（res[0]）；
console.log（res[1]）；
});

出于好奇，我可以问一下您在代码上使用的是什么编程语言吗？这看起来更像是一个模板引擎，对吧？它感觉像是javascript和模板引擎的混合。拆分后的第一次检查每月价格变量中有什么。我从Perl编程语言中获得产品。拆分后，我得到的是空白值。在拆分之前，我得到了正确的值是的，这是一个模板引擎和javascript，你完全正确。出于好奇，我可以问一下你在代码上使用的是什么编程语言吗？这看起来更像是一个模板引擎，对吧？它感觉像是javascript和模板引擎的混合。拆分后的第一次检查每月价格变量中有什么。我从Perl编程语言中获得产品。拆分后，我得到的是空白值。在拆分之前，我得到了正确的值是的，这是一个模板引擎和javascript，你绝对是对的Duc Hong

[% monthly_price.1 %]

[% monthly_price[0] %]

[% monthly_price.first %]