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));