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结构。这个   结构可以嵌套几层深，但应该只包含   一个最重要的元素。“

http://api.jquery.com/wrap/

您是否包装了多个<li>？