Как применить JavaScript к таблице HTML по классам, чтобы показать 2 десятичных знака?

Как применить функции JavaScript к таблице HTML по классам, чтобы показать 2 десятичных знака? JavaScript должен быть применен к определенному классу таблицы HTML "sal".

В таблице по умолчанию будут данные из других источников в 4, 5 или 6 десятичных разрядах, которые мне нужно вывести как 2 десятичных знака.

<html>
   <head>
      <script>
         function myFunction() {
           var num = document.getElementById("sal"); 
           var n = num.toFixed(2); 
           document.getElementById("sal") = n;
          }
         
         onload = myFunction()
      </script>
   </head>
   <body>
      <table class="tg" border=2px;>
      <thead>
         <tr>
            <th class="tg-hdr1">NAME</th>
            <th class="tg-hdr2">SALARY</th>
         </tr>
      </thead>
      <tbody>
         <tr>
            <td class="tg-namehead">Andrew</td>
            <td class="tg-sal">211785.678489</td>
         </tr>
         <tr>
            <td class="tg-namehead">Pete</td>
            <td class="tg-sal">525225.7789</td>
         </tr>
         <tr>
            <td class="tg-namehead">Jack</td>
            <td class="tg-sal">98958.489</td>
         </tr>
      </tbody>
   </body>
</html>
Источник
Codelisting
за 0 против
Лучший ответ

Вы можете выбрать элементы документа по имени класса, используяdocument.getElementsByClassName(className) .

var salaries = document.getElementsByClassName("tg-sal");
for (i = 0; i < salaries.length; i++) {
    var currentValue = salaries[i].innerHTML;
    var newValue = currentValue.substring(0, currentValue.indexOf(".") + 2);
    salaries[i].innerHTML = newValue;
}
  • 0
    Привет, Работает нормально, но есть одна проблема. в моей таблице я получаю неорганизованный формат. как будто мне нужны данные как 0,35%, тогда как он показывает 0,35%
за 2 против

Краткое решение с использованием Number.prototype.toFixed(2) :

document.querySelectorAll('.tg-sal').forEach((e)=>{
  e.innerText = Number(e.innerText).toFixed(2);
})
<table class="tg" border=2px;>
  <thead>
    <tr>
      <th class="tg-hdr1">NAME</th>
      <th class="tg-hdr2">SALARY</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td class="tg-namehead">Andrew</td>
      <td class="tg-sal">211785.678489</td>
    </tr>
    <tr>
      <td class="tg-namehead">Pete</td>
      <td class="tg-sal">525225.7789</td>
    </tr>
    <tr>
      <td class="tg-namehead">Jack</td>
      <td class="tg-sal">98958.489</td>
    </tr>
  </tbody>
</table>

Codelisting
Популярные категории
На заметку программисту