jQuery:修改附加对象的CSS

Question

$('#foo').css({color:'black'}).append('<div>bar</div>').css({color:'red'});

鉴于上述情况,该css()方法适用于foo,但是如何才能将其应用于包含"bar"的div？

我可以想到在同一个执行行中执行此操作的唯一方法是在其中创建一个jQuery div对象append(function(){ ... })并在其中应用样式.

---

注意:我正在尝试避免内联样式(例如.append('<div style="color:red;">bar</div>')).

---

更新:我实际上也在将css应用于foo; 该示例已更新以反映这一点

Answer 1

您可以翻转链,以便.css()使用.appendTo()相反的方式在附加元素上运行,如下所示:

$('<div>bar</div>').appendTo('#foo').css({color:'red'});
//or:
$('<div>bar</div>').css({color:'red'}).appendTo('#foo');
//or:
$('<div />', { text:'bar', css: {color:'red'} }).appendTo('#foo');