jQuery insertBefore，insertAfter问题

Question

我想在jQuery的帮助下把我的图片做成链接：

 $("img:gt(0)").each(function () {
            var curr = $(this);
            if (curr.width() >= 500) {
                var m = 500 / curr.width();
                curr.height(curr.height() * m);
                curr.width(curr.width() * m);
            }
            $("<a href='" + curr.attr("src") + "'>").insertBefore(curr);
            $("</a>").insertAfter(curr);
        });

但是我得到了：

<a href="/Images/7827-1280x800.jpg"></a>
<img height="800" width="1280" src="/Images/7827-1280x800.jpg" alt="" style="height: 312.5px; width: 500px;">

而不是：

<a href="/Images/7827-1280x800.jpg">
<img height="800" width="1280" src="/Images/7827-1280x800.jpg" alt="" style="height: 312.5px; width: 500px;">
</a>

Answer 1

你不需要这样做。您可以使用来完成此操作。

就像这样

curr.wrap("<a href='" + curr.attr("src") + "' />");

Answer 2

您可以使用jQuery提供的wrap()方法

$("img:gt(0)").each(function () {
    var curr = $(this);
    if (curr.width() >= 500) {
        var m = 500 / curr.width();
        curr.height(curr.height() * m);
        curr.width(curr.width() * m);
    }
    curr.wrap($('<a href="' + curr.attr("src") + '">'));
});

Answer 3

这是因为$("<a href='" + curr.attr("src") + "'>")将创建一个公共的html元素。我认为，jQuery将忽略缺少的结束标记，并创建这样的html：<a href="/Images/7827-1280x800.jpg"></a>，而$("</a>")将被完全忽略。