Question

我有一个简化的div，有一些简化的样式：

<div id="divOne" style="width:400px;height:300px;background:#f00">
  This is my content to be wrapped.
</div>

我想创建一个jQuery对象，并在它附加后设置样式。

$(document).ready(function(){
  var divTwo = $('<div \>').css('background','#0f0');
  $('#divOne').wrapInner(divTwo);
  divTwo.css('background','#00f');
});

内部div应该有蓝色背景，而不是绿色。奇怪的是，我可以打电话给alert(divTwo.css('background'));，它会告诉我它是蓝色的。

Answer 1

有趣。这看起来像是一个jquery的怪癖，其中你创建的对象的样式在wrapInner函数中没有被克隆。试试这个：

$(document).ready(function(){
   $('#divOne').wrapInner('<div/>').find('div').css('background','#00f')
});

或者

$(document).ready(function(){
   $('#divOne').wrapInner('<div style="background:#00f"/>')
});

Answer 2

尝试不使用名称属性

$(document).ready(function(){
   $('#divOne').wrappInner('<div\>');
   $('#divOne').children('div').css('background','#0f0')//blue color
});

Answer 3

首先将div附加到dom然后应用样式。

$(document).ready(function(){
   $('#divOne').wrappInner('<div name="innerDiv" \>');
  $('[name=innerDiv]').css('background','#0f0')//blue color
});

在wrapInner函数中使用后，如何更新jQuery对象的css？

3 个答案: