如何转换<文本>(文本标签）在jquery中锚定标签

How to convert <text> (text tag) to anchor tag in jquery?

本文关键字：jquery 标签 文本标签 gt 何转换 转换 lt 文本      更新时间：2023-09-26

我有一个包含纯文本的<text>标记，但我想显示超链接而不是纯文本。

      <svg width="800" height="600" class="overlay">
<g transform="translate(100,220)">
<path class="link" d="M80,120C120,120 120,106.66666666666666 160,106.66666666666666"></path>
<path class="link" d="M80,120C120,120 120,133.33333333333334 160,133.33333333333334"></path>
<path class="link" d="M80,40C120,40 120,26.666666666666686 160,26.666666666666686"></path>
<path class="link" d="M80,40C120,40 120,53.333333333333314 160,53.333333333333314"></path>
<path class="link" d="M0,80C40,80 40,40 80,40"></path><path class="link" d="M0,80C40,80 40,120 80,120"></path><g class="node" transform="translate(160,133.3333282470703)">
<circle class="nodeCircle" r="8" style="fill: rgb(255, 255, 255);"></circle><text x="13" dy=".35em" class="hyper" text-anchor="start" style="fill-opacity: 1;">Tiger</text>

在上面的代码中，lion是纯文本，但我想显示一个超链接。

我试过用.attr()做这件事，但它不起作用。

您可以使用replaceWith:

$(function () {
  $("text").each(function () {
    $(this).replaceWith('<a href="">' + $(this).html() + '</a>');
  });
});
* {font-family: 'Segoe UI'; margin: 0; padding: 0; list-style: none;}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<text x="13" dy=".35em" class="hyper" text-anchor="start" style="fill-opacity: 1;">Lion</text>

我不确定href属性应该放什么，但如果需要，可以通过编辑函数自己放一些东西。

使用replacewith

$('text').replaceWith('<a href="http://example.com">link</a>')
相关文章：