使用jQuery在另一个中包装HTML标记

Question

http://jsfiddle.net/62w8f00o/

我有一些像这样的HTML：

<div><img src="http://i.imgur.com/4pB78ee.png"/></div>

我希望使用jQuery将img标记包含a标记，如下所示：

$(function() {
  var a = '<a href="http://i.imgur.com/4pB78ee.png"></a>';
  // want to wrap the <img> with the above <a> here
});

最终结果如下：

<div>
    <a href="http://i.imgur.com/4pB78ee.png">
        <img src="http://i.imgur.com/4pB78ee.png"/>
    </a>
</div>

如何将img与a一起打包？

Answer 1

您可以使用jQuery wrap function。

$( "img" ).wrap( "<a href=\"http://i.imgur.com/4pB78ee.png\"></a>" );

替换上面$( "img" )的实际选择器，您不想选择网页中的所有图片。

小提琴：http://jsfiddle.net/5c5bffh1/

Answer 2

语法为：

$('.inner').wrap('<a class="outer"></a>);

所以它会是这样的：

$('img').wrap('<a href="http://i.imgur.com/4pB78ee.png"></a>')

Answer 3

使用jQuery .wrap（）

$(function() {
  var a = '<a href="http://i.imgur.com/4pB78ee.png"></a>';
  $('img').wrap(a);  
});

更新小提琴：http://jsfiddle.net/62w8f00o/1/