Question

div.alpha中的网址是动态的。我需要获取此URL并将其应用于包含div.beta中“查看详细信息”的“a href”

<div class="alpha">
    <a href="http://www.url.com">Example</a>
    Plus some other stuff which may contain links, etc
    that I don't want to copy to the other div.
</div>

<div class="beta">
    View Details
</div>

期望的结果：

<div class="alpha">
    <a href="http://www.url.com">Example</a>
    Plus some other stuff which may contain links, etc
    that I don't want to copy to the other div.
</div>

<div class="beta">
    <a href="http://www.url.com">View Details</a>
</div>

我可以获得这样的链接：$('.alpha').find('a').attr('href');

但我不知道如何将该链接传递给下面的XXXX：

$('.beta').each(function(){
    $(this).text($(this).text().replace('View Details', '<a href="XXXX">View Details</a>'));
});

Answer 1

你可以克隆a.alpha，然后用它包裹.b的内容：

// clone the link, remove the text
$link = $('.alpha').find('a').clone().text('');

// wrap all .beta's contents with the cloned link
$('.beta').contents().wrap($link);

Here's a fiddle

Answer 2

您可以通过将代码更新为以下来实现结果。

var href = $('.alpha').find('a').attr('href'); // get href of anchor
var text = $('.beta').text(); // get text of beta element i.e. View Details
var betaHTML = "<a href='" + href + "'>" + text + "</a>"; // Create anchor
$('.beta').html(betaHTML); // Update beta element

Answer 3

var $betaAnchor = $('.alpha a').clone(); //clone anchor
var anchorLabel = $beta.text(); //grab text from beta tag
$('.beta').append($betaAnchor.text(anchorLabel)); //append cloned anchor with beta text

Answer 4

如果您有多个div.alpha和div.beta元素，那么实现这一目标的最佳方式 - 它也适用于一对 - 是：

$('div.beta').html(function(i,html) {
    return $(this).prev('div.alpha').find('a').clone().html( html );
});

    $('div.beta').html(function(i,html) {
        return $(this).prev('div.alpha').find('a').clone().html( html );
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="pair">
  <div class="alpha">
    <a href="http://www.url.com">Example 1</a>
  </div>

  <div class="beta">
    View Details
  </div>
</div>

<div class="pair">
  <div class="alpha">
    <a href="http://www.example.com">Example 2</a>
  </div>

  <div class="beta">
    View Details
  </div>
</div>

Answer 5

jQuery - 将动态链接从一个元素复制到另一个元素

CopyLink = jQuery('.page-id-269 ').find('a').clone().attr('href');
jQuery("#menu-item-387 a").attr("href", CopyLink);

最佳解决方案 100% 有效

jQuery - 将动态链接从一个元素复制到另一个元素

5 个答案:

Here's a fiddle