我有下面的代码。事实上我有几次迭代(多个 DIV 类为 wpdm-pro
:
<div class='wpdm-pro'>
<div class="metro-block span4 wpdm-metro mm-block-03">
<div class="caption">
<h4 class="media-heading" style="padding: 0px;margin:0px">TITLE</h4>
<br/>
<div class="btn-group">
<a class='wpdm-download-link wpdm-download-locked btn btn-success' rel='noindex nofollow' href='http://123.com'>Download</a>
</div>
</div>
</div>
</div>
我的问题是如何获取 URL、应用/包装标题然后隐藏链接/包含的 div?所以它会产生类似下面的东西(逻辑上 - 不是物理上)
<div class='wpdm-pro'>
<div class="metro-block span4 wpdm-metro mm-block-03">
<div class="caption">
<a class='wpdm-download-link wpdm-download-locked btn btn-success' rel='noindex nofollow' href='http://123.com'><h4 class="media-heading" style="padding: 0px;margin:0px">TITLE</h4></a>
<br/>
</div>
</div>
</div>
如果有办法删除 <br/>
标记并将其添加到链接之前,这将是蛋糕上的樱桃。
这是我试过的
<script type="text/javascript">
$("document").ready(function () {
$('.wpdm-download-link').each(function () {
var theLink = $(this).attr('href');
$(this).parentsUntil("div.caption h4").wrap("<a href='" + theLink + "'></div>");
});
});
</script>
最佳答案
这段代码:
$(".wpdm-pro").each(function(e,i) {
var link = $(this).find('a');
var title = $(this).find('h4');
var newLink = link.html(title).clone();
var caption = $(this).find('.caption');
caption.children().not('br').remove();
caption.prepend(newLink);
});
-- 定位链接和标题,添加标题到链接和克隆链接。从 .caption
中删除任何内容除了 <br>
, 将克隆链接作为第一项插入到 .caption
--
产生:
<div class="wpdm-pro">
<div class="metro-block span4 wpdm-metro mm-block-03">
<div class="caption">
<a class="wpdm-download-link wpdm-download-locked btn btn-success" rel="noindex nofollow" href="http://123.com">
<h4 class="media-heading" style="padding: 0px;margin:0px">TITLE</h4>
</a>
<br>
</div>
</div>
</div>
关于jQuery - 获取链接,应用于其他元素并隐藏原始元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21882022/