javascript - 如何添加条件并更改表格行的颜色

标签 javascript jquery html

我有一个 javascript,它将从 JSON 读取值并在 HTML 页面中动态创建一个表。

<div style="width:700px;padding:20px;S">
            <h1 style="text-align:center"><i style="color:#ccc">ALM Server Availability</i></h1>

            <table id="records_table" class="table">
                <tr>
                    <th>Server Name</th>
                    <th>Availability %</th>
                </tr>
            </table>
        </div>

JQUERY:

function availshow(series) {
    // 1. remove all existing rows
    $("tr:has(td)").remove();

    $.each(series.data.hostgroup.hosts, function (index, test) {
       $('<tr>').append(
            $('<td>').text(test.name),
            $('<td>').text(parseInt((test.time_up/86400)*100)),
        ).appendTo('#records_table');           
    });
 }

现在我需要检查 (test.time_up/86400)*100) < 100 值的条件,然后我需要将该特定行设为红色。我怎样才能实现它。

最佳答案

您可以这样做,循环遍历每个 tr,然后查找第二个 td

$('#records_table tr').each(function() {
  var $td = $(this).find('td:eq(1)');
  var value = $td.text();
  if (parseInt(value) < 100) {
    $td.css('background-color', 'red');
  }
});

关于javascript - 如何添加条件并更改表格行的颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48009370/

相关文章:

javascript - angular overlay cdk global positioning strategy和drop element in anywhere in grey area相关的问题

javascript - 在 GET 请求之间保留 javascript 变量?

javascript - 为什么当我在 Eclipse 的构建浏览器中使用 number var 时没有得到输出。?

html - 当 SMS 应用程序未在后台运行时,无法在 iPhone 上的 SMS 链接中预填充电话号码和消息正文

php - joomla 1.5 自定义移动框架不加载 css

javascript - 仅在启用 JavaScript 时定义特定的 CSS 样式

javascript - 一页上有多个表的数据表

javascript - 如何模拟自动对焦

javascript - 表中显示的每周数据总计

javascript - onclick 更改 javascript/JQuery