如何使用jquery设置包装标签中子标签的href属性

Question

所以我有3个div，称为wrapper1。里面有wrapper 2。里面有一些文字和一个按钮。问题是：如何从按钮中获取href，在包装器2周围添加一个标签，并将href添加到a标签中。

到目前为止，我已经找到了所有的wrapper1，在wrapper2周围添加了一个标签。但我不知道如何读写href。

最终结果应为

<div class="wrapper1">
<a href="http://www.ipsum.de">
<div class="wrapper2">
<p>content</p>
<a href="http://www.ipsum.de">button</a>
</div>
</a>
</div>

jQuery(function($) {
$('.wrapper1 .wrapper2').wrap('<a class="lorem" href="???"a>');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<div class="wrapper1">
<div class="wrapper2">
<p>content</p>
<a href="http://www.ipsum.de">button</a>
</div>
</div>

Answer 1

正如您所看到的，在html中使用嵌套的锚标记是无效的。

使用允许您在回调函数中修改包装的标记内容的.wrap( function )。

$('.wrapper1 .wrapper2').wrap(function(){
return '<a href="'+$(this).find('a').remove().attr('href')+'"></a>';
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="wrapper1">
<div class="wrapper2">
<p>content</p>
<a href="http://www.ipsum.de">button</a>
</div>
</div>