如何将HTML中显示的数字格式化为货币格式,包括$符号并用<sup> </sup>放置小数?

时间:2019-06-05 11:48:43

标签: javascript html css

我有一个页面,其中包含几个带有数字的HTML文本字符串,比方说一个是123.20。所有这些都包含在“货币”类的div的第三级中。我想使用JS将它们全部更改为$ 123 .20 格式(每个数字不同)。

除了下面显示的第一个之外,我不能将“ money”类包含到其他任何div中。我无法将其格式化为后端(即使我愿意)。

我不知道从哪里开始。

这是当前HTML的示例。

<div class="elementor-element elementor-element-11138f85 elementor-widget__width-auto money elementor-widget elementor-widget-text-editor" data-id="11138f85" data-element_type="widget" data-widget_type="text-editor.default">
  <div class="elementor-widget-container">
    <div class="elementor-text-editor elementor-clearfix">123.20</div>
  </div>
</div>

这是我需要显示的内容:

<div class="elementor-element elementor-element-11138f85 elementor-widget__width-auto money elementor-widget elementor-widget-text-editor" data-id="11138f85" data-element_type="widget" data-widget_type="text-editor.default">
  <div class="elementor-widget-container">
    <div class="elementor-text-editor elementor-clearfix">$123<sup>.20</sup></div>
  </div>
</div>

3 个答案:

答案 0 :(得分:2)

以下是使用split()

的示例
// find all the elements with your `money` class
var elements = document.getElementsByClassName('money')

// loop through all the `money` elements
for (var i = 0; i < elements.length; i++) {
  // split the money value into two parts (before the decimal and after)
  var amounts = elements[i].innerHTML.split('.')

  // update the content to your formatted version
  elements[i].innerHTML = amounts[0] + '<sup>.' + amounts[1] + '</sup>'
}

答案 1 :(得分:0)

Intl​.Number​Format - MDN

var number = 123456.789;

console.log(new Intl.NumberFormat('tr-TR', { style: 'currency', currency: 'TRY' }).format(number));

输出

₺123.456,79

答案 2 :(得分:0)

欧元:

var number = 1500;

let numCurrency = new Intl.NumberFormat('eu-EU', { style: 'currency', currency: 'EUR' }).format(number);

console.log(numCurrency);

来源: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/NumberFormat