Показать сообщение отдельно
  #4 (permalink)  
Старый 28.02.2015, 13:25
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

Сумма всех значений в колонке таблицы
_Eldar_, css внизу из-за ie
нужную колонку указать в строке 35
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">

  </head>

<body>
<table>
    <tr>
        <td>1</td>
        <td>2</td>
    </tr>
    <tr>
        <td>-400</td>
        <td>2</td>
    </tr>
    <tr>
        <td>100</td>
        <td>2</td>
    </tr>
    <tr>
        <td>-10</td>
        <td>2</td>
    </tr>
    <tr>
        <td></td>
        <td>2</td>
    </tr>
</table>
<script>
   var td = document.querySelectorAll('table td:nth-child(1)') ;
    function sum(previousSum, currentItem) {
   var result = previousSum +  +currentItem.innerHTML||0;
   currentItem.dataset.text = result;
   result < 0 && currentItem.classList.add('red');
   return result;
}
Array.prototype.reduceRight.call(td,sum,0)
</script>
<style type="text/css">
  td:nth-child(1):after  {
      display: block;
      float: right;
      content:attr(data-text);
      color: #006400;
      background-color: #FFFACD;
      font-size: 90%;
      padding: 2px;
  }
  td.red:nth-child(1):after  {
      color: #FF3333;
        }
</style>
</body>

</html>

Последний раз редактировалось рони, 28.02.2015 в 13:28.
Ответить с цитированием