如何从锚标记中提取 href 值并作为文本插入？

Question

如果我有 html 代码：

<a href="google.com" class='link'>hi</a>

如何提取 href 值并将其添加为文本：

<a href="google.com" class='link'>hi google.com</a>

我看过很多关于提取 href 值的帖子，但我不确定如何将其作为文本插入。谢谢你。

Answer 1

你可以这样做：$('.link').text(function() {&nbsp; return $(this).text() + " " + $(this).attr("href");})演示$('.link').text(function() {&nbsp; return $(this).text() + " " + $(this).attr("href");})<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><a href="google.com" class='link'>hi</a>

Answer 2

你也可以用这个$('input:button').click(function(){&nbsp; &nbsp; &nbsp; var h = $('.link').attr('href');&nbsp; &nbsp; &nbsp; var t = $('.link').text();&nbsp; &nbsp; &nbsp; $('.link').text(t+' '+h);&nbsp; });<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><a href="google.com" class='link'>hi</a>&nbsp;<input type="button" value="push"></button>

Answer 3

您可以使用jquery text功能$('.link').text(function(a) {&nbsp; return $(this).text().trim() + ',' + $(this).attr('href')})a {&nbsp; text-decoration: none;}<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><a href="google.com" class='link'>hi</a>使用本机 javascript，您可以使用document.querySelectorAll公共类获取元素并遍历它们并更新文本document.querySelectorAll('.link').forEach((e) => {&nbsp; e.textContent = e.textContent + ' , ' + e.getAttribute('href')})<a href="google.com" class='link'>hi</a>