Javascript jQuery分离和重新附着元素的更简单方法

对不起，我想不出更好的标题了。我很想知道写下面函数的更好、更简单、更短的方法是什么。特别是移动周围的元素

它基本上为每个

img

创建一个父

div

，并将

img

放在其中。它还将

img

的title属性添加到上面容器中的另一个

div

中

$('.view-sidebar .field-item img').each(
    function(){
        $(this).parent().append('<div class="img-container"></div>');
        $(this).appendTo($(this).parent().find('.img-container'));
        $(this).parent().append('<div class="img-caption">'+$(this).attr('alt')+'</div>');
});

$（'.view sidebar.field item img'）。每个(
函数（）{
$（this.parent（）.append（“”）；
$（this.appendTo（$（this.parent（）.find（'.img container'））；
$（this.parent（）.append（“”+$（this.attr（'alt'）+“”）；
});

我认为您应该只使用，在这种情况下不需要附加/分离/附加

$(this).wrap('<div class="img-container"></div>');

$（this.wrap（“”）；

---

$（'.view sidebar.field item img'）。每个（函数（）{
var div=$（''）{
类：“img标题”，
文本：this.alt
});
$（此）.wrap（“”）.after（div）；
});

---

也许您可以创建一个小提琴来演示您的代码的功能？@Jack，谢谢您的建议。更新。

$('.view-sidebar .field-item img').each(function () {
    var div = $('<div/>', {
        class: 'img-caption',
        text: this.alt
    });
    $(this).wrap('<div class="img-container"></div>').after(div);
});