使用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>

如何用a包裝我的img ？

Answer 1

您可以使用jQuery wrap函數 。

$( "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/