1. 程式人生 > 其它 >利用正則新增千分符(JavaScript)

利用正則新增千分符(JavaScript)

技術標籤:前端# JavaScript小練習

在這裡插入圖片描述

<body>
  <input type="text">
  <button>新增千分符</button>
  <p></p>
</body>

方法一:

  <script>
    var input = document.querySelector("input");
    var p = document.querySelector("p");
    var btn = document.
querySelector("button"); btn.onclick = function() { var str = input.value.split(""); //將多餘的位數分離出來 var more = str.slice(0, (str.length % 3)); str = str.slice((str.length % 3)); str = str.join('').match(/[0-9]{3}/g).join(","); p.innerHTML =
[...more, ",", ...str].join(""); }
</script>

方法二(比較高效):

  <script>
    var input = document.querySelector("input");
    var p = document.querySelector("p");
    var btn = document.querySelector("button");
    btn.onclick = function
() { str = input.value; var re = /(\d+)(\d{3})/; while (re.test(str)) { str = str.replace(re, function($0, $1, $2) { return $1 + ',' + $2; }) } p.innerHTML = str; }
</script>

方法三:

  <script>
    var input = document.querySelector("input");
    var p = document.querySelector("p");
    var btn = document.querySelector("button");
    btn.onclick = function() {
      var str = input.value.split("").reverse().join("");
      var strL = str.length;
      str = str.replace(/\d{3}/g, function($0) {
        return $0 + ",";
      })
      str = str.split("").reverse().join("");
      if (strL % 3 == 0) {
        str = str.substring(1); //如果剛好前面會多一個,
      }
      p.innerHTML = str;
    }
  </script>