-1

我想将一些文本项附加到 div 元素并用不同的颜色绘制它们。

这是我的代码：

for (var i = 0; i < data.length; i++) {
    if (data[i].Id <= 2)
        $("#div3").append('<p>' + data[i].FirstName + '</p>').css('color', 'red');
    else if (data[i].Id > 2 && data[i].Id <= 4)
        $("#div3").append('<p>' + data[i].FirstName + '</p>').css('color', 'green');
    else
        $("#div3").append('<p>' + data[i].FirstName + '</p>').css('color', 'blue');
}

但是，它们都是蓝色的。

出了什么问题以及如何解决？

4

4 回答 4

3

您将颜色应用于#div3，而不是其中的 p 标签。这就是为什么最后一个适用于所有 p 的原因。要修复它，您可以给每个 p 一个类，并在那里指定颜色。或者通过 jquery 选择 p 标签并以这种方式应用颜色。

于 2013-07-23T11:10:54.503 回答
1

改用appendTo()：

 $('<p>' + data[i].FirstName + '</p>').appendTo("#div3").css('color', 'red');
于 2013-07-23T11:15:31.180 回答
0

用这个：

$("#div3").append('<p style="color:red">' + data[i].FirstName + '</p>');
于 2013-07-23T11:11:32.993 回答
0

您是否尝试过给每个“p”一个类并将样式抽象为css？或者尝试根据索引给每个 p 元素一个 id ？像这样;

for (var i = 0; i < data.length; i++) {
   if (data[i].Id <= 2){
       $("#div3").append('<p id="p' + i + '">' + data[i].FirstName + '</p>')
       $("#p" + i).css('color', 'red');
   }else if (data[i].Id > 2 && data[i].Id <= 4){
       $("#div3").append('<p id="p' + i + '">' + data[i].FirstName + '</p>')
       $("#p" + i).css('color', 'green');
   }else{
       $("#div3").append('<p id="p' + i + '">' + data[i].FirstName + '</p>')
       $("#p" + i).css('color', 'blue');
   }
}
于 2013-07-23T11:26:06.750 回答