2

我有这个CSS规则，

.messagesContent:nth-child(even){
    float: right;
    background: white;
}
.messagesContent:nth-child(odd){
    float: left;
    background: #ccc;
}

我使用 jquery 在所有元素之前添加一个元素，用这个

var c = $("#content_2").find(".mCSB_container li:first");
result = eval(result);
c.before(result.html);

如果它添加到 dom ，元素的背景颜色会发生变化（偶数和奇数变化）我该如何防止这种变化？

4

3 回答 3

0

如果您只向列表中添加 1 个元素，则奇/偶样式将切换。如果不希望它们切换，则需要将新元素添加到列表底部或添加偶数个新元素。

这是一个添加到列表顶部或底部的简单示例：http: //jsfiddle.net/VHm7z/1，您可以在其中将项目添加到列表的顶部或底部。

假设您有列表，其中 list 是 UL 元素的 jQuery 对象，而 li 是 LI 元素的 jQuery 对象：

list.append(li);  // adds to bottom of list

或者

list.prepend(li);  // adds to top of list
于 2013-08-22T16:57:52.133 回答
0

如果它们都是 li 元素，那么背景图像自然会发生变化，因为您的代码适用于奇数和偶数元素，并且您在顶部添加了一个额外的元素。也许为第一个孩子创建一个规则，它总是相同的颜色，这可能会阻止它。

于 2013-08-22T17:04:52.240 回答
0

首先，将偶数/奇数类添加到项目中：

$(".messagesContent").each(function(i,obj) {
   $(obj).addClass( (i % 2 === 0 ? "even" : "odd"));
});

然后在那之后添加你的节点。

此外，将您的 CSS 规则更改为“.even”和“.odd”，而不是 :nth-child()

于 2013-08-22T17:13:19.583 回答