jQuery:修改附加对象的CSS

你可以把链子转过来 .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');

试试这个:

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

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

或者$之类的

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

最简单的方法是使用append to()而不是append():

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

你可以在这里找到一个工作样本: http://jsfiddle.net/YdzGZ/

怎么办:

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

不如从动态方法后退一步,在css中创建一两条规则?

#foo { color: black; }
#foo div,
#foo .orViaSomeClassName { color: red; }

不需要像这样胡闹注入内联样式。

最后是另一种获得附加div的方法:

$('#foo')
    .css('color', 'black') // css on #foo
    .append('<div>bar</div>') // appended to #foo
    .find('div')
        .css('color', 'red'); // css on divs inside #foo