Раскраска текста для всех значений столбца таблицы

Question

У меня есть компонент таблицы, который я не могу изменить внутри, но вместо этого мне нужно прочитать элемент DOM и покрасить отрицательные значения в специальном столбце красным.Итак, допустим, у меня есть таблица, подобная этой:

<table id="mytable">
    <tr>
        <td>
            Person 1
        </td>
        <td>
            Address 1
        </td>
        <td>
            -2435
        </td>
    </tr>
    <tr>
        <td>
            Person 2
        </td>
        <td>
            Address 2
        </td>
        <td>
            432
        </td>
    </tr>
</table>

Каков оптимальный способ прочитать элемент таблицы и закрасить отрицательное значение суммы для человека 1?

Answer 1

Хм, вы получаете данные в таблицу из $http или из javascript $scope объекта? Если это так, вы можете использовать простой ng-class HTML:

<table id="mytable">
        <tr ng-repeat="data in data">
            <td>
               {{data.person}}
            </td>
            <td>
                {{data.adres}}
            </td>
            <td ng-class="{negative: data.number < 0}">
                 {{data.number}}
            </td>
        </tr>
    </table>

Ваши данные:

 $scope.data = [{
   "person" : "person 1",
   "adress" : "Adress 1",
   "number": 2432
 },{
   "person" : "person 2",
   "adress" : "Adress 2",
   "number": -123
 }]

Style:

.negative {
    color: red;
}

Плункер: http://plnkr.co/edit/MZlUk7LsfYlNQtsC8xea?p=preview

Answer 2

Я предполагаю, что вы хотите сделать это в Javascript; это фрагмент:

document.querySelectorAll('#mytable td').forEach(function(e) {
    if (!isNaN(e.innerText)) {
       e.style.color = 'red';
    }
});

http://jsfiddle.net/6dqkeo9L/