wrap（）方法和子元素

Question

当我这样做：

myUl = $(document.createElement("ul"));
myLi = $(document.createElement("li"));
myUl.append(myLi);

myLi成为myUl的子元素。这很好。

当我这样做：

myUl = $(document.createElement("ul"));
myLi = $(document.createElement("li"));
myLi.wrap(myUl);

然后myUl有0个子元素，即使DOM看起来相同。这是正常的吗？

Answer 1

.wrap正在使用myUl的克隆，而不是像.append那样的原始。

当您考虑在具有多个元素的jQuery对象上调用.wrap时，将每个元素包装在您传递的任何内容的单独副本中，这是有道理的。

更新：根据您的其他评论，我认为您想要做的是：

myLi = $(document.createElement("li"));
myLi.wrap('<ul>');

这个（或类似的代码）将使用动态创建的新UL包装现有元素。

Answer 2

而不是document.createElement，你可以使用$("<ul>") ...所以例如：

$("<li>").wrap($("<ul>"));

我会采用这种方法而不是试图将myLi包装在现有的myUl对象中，就像这样......

var $li = $("<li>");

//added class for another short-hand example
$("<ul class='myClass'>").append($li);

假设您在页面上有一个现有元素，并且您希望将其包装在一个新创建的JS对象中......

var $ul = $("<ul>");  
$('#myLi').appendTo($ul)

//and if you want to clone it
$('#myLi').clone().appendTo($ul)

Answer 3

来自文档：

“.wrap（）函数可以接受任何可以传递给$（）工厂函数的字符串或对象来指定一个DOM结构。这个结构可以嵌套几个层次，但是应该只包含一个inmost元素。”

你是不是包装了一个<li>？