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

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>