将目标添加到 SVG 标记答案

【问题标题】：Add target to SVG a tag将目标添加到 SVG 标记
【发布时间】：2021-03-21 07:03:50
【问题描述】：

我正在尝试将 target="_blank" 添加到我的 SVG <a/> 标记中，但我不知道为什么我的代码不起作用。

<script src="http://code.jquery.com/jquery-2.2.3.min.js"></script>
<script>
    function loadedSVG() {
        $('#svg1 a').attr('target', '_blank');
    }
</script>
<object id="svg1" data="SVG_File.svg" type="image/svg+xml" onload='loadedSVG()'>
    <a href="http://www.yahoo.com/">yahoo</a>
</object>

该代码适用于 Yahoo 链接，但不适用于 SVG 文件中的 href，有人知道我该如何解决这个问题吗？

【问题讨论】：

SVG 文件是一个单独的文档。您需要在该文件中运行脚本或提取对象的文档并以这种方式更新所有内容。
在创建 SVG
这是我概述的第二种方法。

标签： php jquery svg

【解决方案1】：

我认为链接必须在对象标签之外

function loadedSVG() {
  $('#container a').attr('target', '_blank');
}

#container{
  position: relative;
  width: 150px;
  height: 150px;
}

a{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: blue;
  color: white;
}

#svg1{
   width: 100%;
   height: 100%;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<div id="container">
    <a href="http://www.yahoo.com/">yahoo</a>
    <object id="svg1" data="https://la-cascade.io/content/images/2015/06/kiwi.svg" type="image/svg+xml" onload='loadedSVG()'>
    </object>    
</div>

问候

【讨论】：

我想你误解了我的问题。该脚本将 target='blank' 添加到 yahoo 链接，但我的问题是它对 SVG 文件中的 href 没有做同样的事情。
@Unskilled 哦，对不起。也许这个链接可以帮助你。有一个例子：[链接]stackoverflow.com/questions/64452584/…

【解决方案2】：

你应该把object标签放在a标签里

<script src="http://code.jquery.com/jquery-2.2.3.min.js"></script>
<script>
    function loadedSVG() {
        $('#svg1 a').attr('target', '_blank');
    }
</script>
<a href="http://www.yahoo.com/">
   <object id="svg1" data="SVG_File.svg" type="image/svg+xml" onload='loadedSVG()'>
     yahoo
   </object>
</a>

希望对你有帮助

【讨论】：