Question

我想用以前的链接中的href链接替换h2标签中的文本或在其中添加文本，并添加一些润滑脂脚本。例如，我有十个这些链接：

<div class="cml">This is some <a href="www.link1.com">SomeLinkText1</a></div>
<h2 class="legend">Some text 1</h2>
<div class="cml">This is some <a href="www.link2.com">SomeLinkText2</a></div>
<h2 class="legend">Some text 2</h2>
...

我需要这样：

<div class="cml">This is some <a href="www.link1.com">SomeLinkText1</a></div>
<h2 class="legend">Some text 1 - www.link1.com</h2>
<div class="cml">This is some <a href="www.link2.com">SomeLinkText2</a></div>
<h2 class="legend">Some text 2 - www.link2.com</h2>
...

因此，我只想提取页面上的所有href并将其显示在h2或某些新的div中（无论在什么地方，也可以在相同的tag中插入SomeLinkText），例如：

<div class="cml">This is some <a href="www.link1.com">www.link1.com</a></div>
<div class="cml">This is some <a href="www.link2.com">www.link2.com</a></div>
...

我对javascript非常虚弱。我在这里使用搜索，发现了一些答案，但仅适用于第一个链接。

$('.legend').html($('.cml a').prop('href'));

有人可以帮助我提供代码，以便我在页面上动态显示href吗？

谢谢。

Answer 1

可以使用text(function)来遍历每个实例。函数this中是当前元素实例，您可以使用它遍历上一个元素以获得相应的href

$('.legend').text(function(index, currText) {
  var linkUrl = $(this).prev('.cml').find('a').attr('href');
  return currText + ' - ' + linkUrl;
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="cml">This is some <a href="www.link1.com">SomeLinkText1</a></div>
<h2 class="legend">Some text 1</h2>
<div class="cml">This is some <a href="www.link2.com">SomeLinkText2</a></div>
<h2 class="legend">Some text 2</h2>

Answer 2

或者您也可以循环a并将文本附加到父h2的下一个cim，例如

$('a').each(function(){
  $(this).closest(".cml").next().text($(this).closest(".cml").next().text() + " - "+$(this).attr("href"))
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="cml">This is some <a href="www.link1.com">SomeLinkText1</a></div>
<h2 class="legend">Some text 1</h2>
<div class="cml">This is some <a href="www.link2.com">SomeLinkText2</a></div>
<h2 class="legend">Some text 2</h2>

Answer 3

您可以使用jquery的每个函数来迭代每个cml类，并将所需的文本附加到h2

$(".cml").each(function(){
     var linkToAppend = $(this).find("a").attr('href');
     $(this).next().append(" - " + linkToAppend);
});

在div页面上显示HREF链接

3 个答案: