Javascript 使用引导行和列Divs包装Div的函数不会影响传递的参数

由引用的代码应该产生三个“.col-md-4”div，每个div在一个单独的行中居中（带有偏移），但是，这不是我想要的

我认为我在传递参数和“丢失”变量值方面做错了，尽管我无法找出错误所在

var wrapWithBootstrap=函数（toBeWrapped）
{
待包装。包装（“”）；
toBeWrapped.find（'.first div'）.wrapp（''）；
toBeWrapped.find（'.second div'）.wrapp（''）；
toBeWrapped.find（'.third div'）.wrapp（''）；
}
$（文档）.ready（函数（）
{
var wrapperDiv=$（“这是我的第一个div.”）；
wrapWithBootstrap（wrapperDiv）；
$（'#main'）.append（wrapperDiv）；
var wrapperDiv=$（“这是我的第二个div.”）；
wrapWithBootstrap（wrapperDiv）；
$（'#main'）.append（wrapperDiv）；
var wrapperDiv=$（“这是我的第三个div.”）；
wrapWithBootstrap（wrapperDiv）；
$（'#main'）.append（wrapperDiv）；
});
正文
{
填充：32px；
背景色：#bbb；
}
.第一组
{
颜色：#336；
背景色：#9bb；
字体大小：16px；
边框：1px实心#336；
填充：32px；
文本对齐：居中；
}
.第二组
{
颜色：#363；
背景色：#9b9；
字体大小：16px；
边框：1px实心#494；
填充：32px；
文本对齐：居中；
}
.第三组
{
颜色：#633；
背景色：#b99；
字体大小：16px；
边框：1px实心#633；
填充：32px；
文本对齐：居中；
}
这应该能帮你解决问题

功能（待包装）；
$（文档）.ready（函数（）
{
var wrapperDiv=$（“这是我的第一个div.”）；
wrapWithBootstrap（wrapperDiv）；
$（'#main'）.append（wrapperDiv）；
var wrapperDiv=$（“这是我的第一个div.”）；
wrapWithBootstrap（wrapperDiv）；
$（'#main'）.append（wrapperDiv）；
var wrapperDiv=$（“这是我的第一个div.”）；
wrapWithBootstrap（wrapperDiv）；
$（'#main'）.append（wrapperDiv）；
});
这样做很奇怪，但我不会质疑。但是，我要指出，您在同一范围内声明了同一变量三次

这应该是你要找的。注意，我已经链接了wrap命令，并为其取出了“find”命令。在调用要包装的元素之前，我还附加了这些元素：

var wrapWithBootstrap = function(toBeWrapped) {
  toBeWrapped.wrap('<div class="row"></div>').wrap('<div class="col-md-offset-4 col-md-4"></div>');
}

$(document).ready(function() {
  var wrapperDiv=$('<div class="first-div">    This is my first div.</div>');
  $('#main').append(wrapperDiv);
  wrapWithBootstrap(wrapperDiv);

  var wrapperDiv=$('<div class="second-div">    This is my first div.</div>');
  $('#main').append(wrapperDiv);
  wrapWithBootstrap(wrapperDiv);

  var wrapperDiv=$('<div class="third-div">    This is my first div.</div>');
  $('#main').append(wrapperDiv);
  wrapWithBootstrap(wrapperDiv);
});

var wrapWithBootstrap=函数（toBeWrapped）{
包裹。包裹（“”）。包裹（“”）；
}
$（文档）.ready（函数（）{
var wrapperDiv=$（“这是我的第一个div.”）；
$（'#main'）.append（wrapperDiv）；
wrapWithBootstrap（wrapperDiv）；
var wrapperDiv=$（“这是我的第一个div.”）；
$（'#main'）.append（wrapperDiv）；
wrapWithBootstrap（wrapperDiv）；
var wrapperDiv=$（“这是我的第一个div.”）；
$（'#main'）.append（wrapperDiv）；
wrapWithBootstrap（wrapperDiv）；
});

代码笔：
这就解决了问题，只是为了正确地显示它，不过，我需要在函数内部完成引导包装，实际上是为了更复杂和有条件的包装。
var wrapWithBootstrap = function(toBeWrapped) {
  toBeWrapped.wrap('<div class="row"></div>').wrap('<div class="col-md-offset-4 col-md-4"></div>');
}

$(document).ready(function() {
  var wrapperDiv=$('<div class="first-div">    This is my first div.</div>');
  $('#main').append(wrapperDiv);
  wrapWithBootstrap(wrapperDiv);

  var wrapperDiv=$('<div class="second-div">    This is my first div.</div>');
  $('#main').append(wrapperDiv);
  wrapWithBootstrap(wrapperDiv);

  var wrapperDiv=$('<div class="third-div">    This is my first div.</div>');
  $('#main').append(wrapperDiv);
  wrapWithBootstrap(wrapperDiv);
});