wrapInner不会添加子元素来包装DOM中的元素

Question

我正在尝试做一个innerWrap，然后处理包装的内容。然而，包装似乎从来没有得到它的孩子添加！这是一个测试，显示了问题：

var images = $(element).find('img'); 
console.log(images); 
var wrap  = document.createElement("div") 
$(element).wrapInner(wrap) 
var images2 = $(wrap).find('img'); 
console.log(images2); 

View as JSFiddle

任何想法？

Answer 1

显然，当您将一个元素传递给.wrapInner()函数时，该元素的结构上相同的副本，而不是元素本身包裹在内容中。在你的榜样，你会发现以下内容：

• 的#element结束有一个孩子如期望的那样，它包含三个图像
• 但wrap.parentNode是null表明它存在于内存中一个div，不附DOM
• 而wrap === $("#element").children().get(0)返回false证实的假设

解决方法：修改你的代码是这样的：

var $images1 = $("#element").find('img'); 
$("#element").wrapInner("<div></div>"); 
var $images2 = $("#element").children().find("img"); 
// the div can be accessed by doing $("#element").children() 
console.log($images1.length, $images2.length, $images1.get(0) === $images2.get(0));