如何使用javascript格式化同一类表列中的数据

How to format data from table column with the same class using javascript

本文关键字:一类 数据 javascript 何使用 格式化      更新时间:2023-09-26

我在foreach循环中有一个表行,其中有一些列具有相同的类,我的问题是如何在javascript中将该列中的每个数据格式化为###、###(使用逗号格式化数字)?

这是我的表格结构示例:

    <tbody id="binder">
<?php foreach () { ?>        
        <tr id="data">
            <td class="sum">400000</td>
            <td class="sum">500000</td>
            <td class="sum">500000</td>
            <td class="sum">0</td>
            <td class="sum">0</td>
            <td class="sum">500000</td>
            <td class="sum">500000</td>
            <td class="sum">0</td>
            <td class="sum">0</td>
            <td class="sum">500000</td>
            <td class="sum">500000</td>
            <td class="sum">0</td>
            <td class="sum">0</td>
            <td class="sum">500000</td>
            <td class="sum">500000</td>
            <td class="sum">0</td>
            <td class="sum">0</td>
            <td class="sum">500000</td>
            <td class="sum">500000</td>
            <td class="sum">0</td>
            <td class="sum">0</td>
            <td class="sum">500000</td>
            <td class="sum">500000</td>
            <td class="sum">0</td>
            <td class="sum">0</td>
        </tr>
<?php } ?>
    </tbody>

您可以获取具有特定类名的所有元素,然后格式化其innerHTML。下面是一个工作片段。

var allTds = document.getElementsByClassName("sum");
for (var i = 0; i < allTds.length; i++) {
  allTds[i].innerHTML = allTds[i].innerHTML.toString().replace(/'B(?=('d{3})+(?!'d))/g, ",");
}
td{
   border:1px solid;
  }
<table>
  <tbody id="binder">
    <tr id="data">
      <td class="sum">400000</td>
      <td class="sum">500000</td>
      <td class="sum">500000</td>
      <td class="sum">0</td>
      <td class="sum">0</td>
      <td class="sum">500000</td>
      <td class="sum">500000</td>
      <td class="sum">0</td>
      <td class="sum">0</td>
      <td class="sum">500000</td>
      <td class="sum">500000</td>
      <td class="sum">0</td>
      <td class="sum">0</td>
      <td class="sum">500000</td>
      <td class="sum">500000</td>
      <td class="sum">0</td>
      <td class="sum">0</td>
      <td class="sum">500000</td>
      <td class="sum">500000</td>
      <td class="sum">0</td>
      <td class="sum">0</td>
      <td class="sum">500000</td>
      <td class="sum">500000</td>
      <td class="sum">0</td>
      <td class="sum">0</td>
    </tr>
  </tbody>
</table>

正则表达式引用取自此答案。https://stackoverflow.com/a/2901298/2592042