Question

您好我正在使用jQuery并在循环中创建标记。

前 -

for(var i=0;i<length;i++){

            jQuery("#dailydata").append("<table class='table'><tr>"+
                "<th>Min Temp : </th><td>"+ data[i]</td>" +
                "</tr></table>";

                if(data[i] <=10){
                    //add color to th
                }else{
                    //add different color to th
                }
        }

我在每个循环中创建一个表行并附加到HTML元素。之后，我正在检查值，根据该值，我想更改标签的背景颜色。

有人可以告诉我如何实现这个目标吗？

Answer 1

有几种方法。

您用来构建代码的方法并不是最优雅的方法，但您可以根据以下结果对其进行调整以获得结果......

jQuery("#dailydata").append("<table class='table'><tr>"+
            "<th id='"+ (data[i]<=10?'blue':'red') + "'>Min Temp : </th><td>"+ data[i]</td>" +
            "</tr></table>";

我建议你也阅读jQuery文档，了解如何使用＆＃39; attr＆＃39;和＆＃39; prop＆＃39;将id（和其他属性/属性）添加到jQuery元素，而不像我的示例那样将文本一起黑客攻击。

jQuery＆＃39; attr＆＃39;：https://api.jquery.com/attr/

jQuery＆＃39; prop＆＃39;：https://api.jquery.com/prop/

Answer 2

基于代码的最简单方法：

for (var i = 0; i < length; i++) {
  var color;
  if(data[i] <=10) {
    color = "ff0000";
  } else{
    color = "0000ff";
  }

  jQuery("#dailydata").append(
    "<table class='table'><tr>" +
    "<th style="background-color:#" + color + 
    ">Min Temp : </th><td>" + data[i]</td>" +
    "</tr></table>");
}

Answer 3

您可以添加额外的if条件来检查i的值

在此示例中，假设length的值大于i。在您的示例中，您使用的是data[i]，但循环将在length变量上运行。此处有一个拼写错误data[i]</td>"它必须是data[i]+"</td>"。此外，append方法也会以)

结束

＆＃13;

var length = 15;
for (var i = 0; i < length; i++) {

  if (i < 10) {
    jQuery("#dailydata").append("<table class='table'><tr>" +
      "<th class='less10'>Min Temp : </th><td>" + i + "</td>" +
      "</tr></table>");
  } else {
    jQuery("#dailydata").append("<table class='table'><tr>" +
      "<th class='more10'>Min Temp : </th><td>" + i + "</td>" +
      "</tr></table>");
  }

}

＆＃13;

.less10 {
  color: green
}

.more10 {
  color: blue
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="dailydata">
</div>

＆＃13;

Answer 4

<强>首先

您不应对ids使用数值（0,1,2,3等）。 HTML specification说出这个：

ID和NAME令牌必须以字母（[A-Za-z]）开头，后面可以跟任意数量的字母，数字（[0-9]），连字符（“ - ”），下划线（“_”），冒号（“：”）和句号（“。”）。

<强>其次：

您的代码是重量的......您是否在示例中未显示的行中创建了一个名为“length”的变量？我假设在你的for循环中你的意思是i<data.length

因此，请记住使用字母前缀：

// Note jQuery("#dailydata") same as $("#dailydata") unless you override the use of the "$" symbol

for(var i=0; i<data.length; i++) {
    var newElementId = "some_prefix_"+i;

    var newElementToAppend = $("<div>").attr("id", newElementId);
    $("#dailydata").append(newElementToAppend);
}

使用jQuery为元素分配动态ID

4 个答案: