如何使用jQuery同时追加（）一个元素并使用css（）设置其样式

Question

我尝试了$('#canvas').append('<div class="tile"></div>').css({left: leftPos, top: topPos});，但设置了#canvas的样式而不是附加的元素。

然后我尝试了$('#canvas').append(('<div class="tile"></div>').css({left: leftPos, top: topPos}));，但这会产生错误“对象<div class="tile"></div>没有方法'css'”。

如何添加元素并同时设置其样式？

Answer 1

你可以这样做：

$('<div class="tile"></div>').css({left: leftPos, top: topPos})
                             .appendTo('#canvas');

这会创建元素，对其进行样式化，然后使用.appendTo()将其放在同一个位置。

或者，如果您使用的是jQuery 1.4，则可以在创建时指定属性，包括CSS，如下所示：

$('<div />', { class:'title', css: {left: leftPos, top: topPos}})
   .appendTo('#canvas');​

有关此方法的更多信息，请查看jQuery() documentation，特别是jQuery(html,props)部分。