脚本文件中的千位分隔符

Thousand separator in script file

本文关键字：千位 分隔符 文件 脚本      更新时间：2023-09-26

这是我在页面上呈现自动增量计数器的代码:

<script>
  document.addEventListener("DOMContentLoaded", function(event) {
    var START_DATE_1 = new Date("July 18, 2016 10:30:00"); // put in the starting date here
    var INTERVAL_1 = 3; // in seconds
    var INCREMENT_1 = 1; // increase per tick
    var START_VALUE_1 = 0; // initial value when it's the start date
    var count_1 = 0;
    var msInterval_1 = INTERVAL_1 * 1000;
    var now_1 = new Date();
    count_1 = parseInt((now_1 - START_DATE_1)/msInterval_1) * INCREMENT_1 + START_VALUE_1;
    document.getElementById('counter_1').innerHTML = count_1;
    setInterval(function() {
      count_1 += INCREMENT_1;
      document.getElementById('counter_1').innerHTML = count_1;
    }, msInterval_1);
  });
</script>

我想用千位分隔符来显示计数器的数字(例如:2.000.000)

我应该如何编辑脚本?

在现代浏览器上你可以使用Intl API

Intl对象是ECMAScript的命名空间国际化API，提供语言敏感字符串比较，数字格式，日期和时间格式。的Collator、NumberFormat和DateTimeFormat对象的构造函数是Intl对象的属性。本页记录了这些内容属性以及国际化通用的功能构造函数和其他语言敏感函数。

我在下面的例子中使用意大利语，只是基于你的名字，它使用你所需的格式。

var START_DATE_1 = new Date('July 18, 2016 10:30:00').getTime(); // put in the starting date here
var INTERVAL_1 = 3; // in seconds
var INCREMENT_1 = 1; // increase per tick
var START_VALUE_1 = 0; // initial value when it's the start date
var msInterval_1 = INTERVAL_1 * 1000;
var now_1 = Date.now();
var count_1 = Math.trunc((now_1 - START_DATE_1) / msInterval_1) * INCREMENT_1 + START_VALUE_1;
function formatNumber(number) {
  return new Intl.NumberFormat('it').format(number);
}
document.getElementById('counter_1').textContent = formatNumber(count_1);
setInterval(function() {
  count_1 += INCREMENT_1;
  document.getElementById('counter_1').textContent = formatNumber(count_1);
}, msInterval_1);
<pre id="counter_1"></pre>

相关文章：