从 div 中获取特定文本并制作成 link

Question

我不确定这是否可行，我一直在尝试 jQuery，但还没有成功。

我想从 div 中获取文本并将它们转换为链接。

问题是我希望这 3 个名称成为单独的链接，例如 href="/staff/john" 、 href="/staff/sarah" 和 href="/staff/mike"

如有任何帮助，我们将不胜感激。

<div id="container">
john, sarah, mike
</div>

Answer 1

像这样 - 不需要 jQuery

const container = document.getElementById("container");
container.innerHTML = container.textContent.split(",")
  .map(name => `<a href="/staff/${name.trim().toLowerCase().replaceAll(" ","-")}">${name.trim()}</a>`)
  .join(", ")

<div id="container">
John Doe, Sarah Doe, Mike Hunt
</div>

但如果你想 jQuery 你可以做到

$("#container").html(function() {
  return $(this).text().split(",")
    .map(name => `<a href="/staff/${name.trim().toLowerCase().replaceAll(" ","-")}">${name.trim()}</a>`)
    .join(", ")
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="container">
  John Doe, Sarah Doe, Mike Hunt
</div>

从 div 中获取特定文本并制作成 link

Get specific text from a div and make into a link

html

javascript

jquery

text

hyperlink