jquery 将 href 转为 xlink:href

Question

我正在尝试对 svg 中的链接进行以下重写：

<a href="/node/1">link title</a>

到

<a xlink:href="/node/1">link title</a>

因为如果没有 XLINK 部分，此类链接将无法在 safari 上使用。

我尝试更改为我的网站生成这些链接的 drupal 视图，但出于安全原因，系统忽略了所有属性，并且链接仅打印为 href。

我唯一的选择是用 jquery 改变结果，但到目前为止我还没有成功。

Answer 1

只需循环 a 元素并更改它们。在普通 javascript 中比 jQuery.

更容易

var elements = document.getElementsByTagName("a");
for (var i = 0; i < elements.length; i++) {
    elements[i].setAttributeNS("http://www.w3.org/1999/xlink", "href", elements[i].href);
}

<svg>
    <a href="/node/1"><text y="20">link title</text></a>
</svg>

Answer 2

使用函数.attr()，然后你就可以添加任何类型的属性

$(function(){
  $("body a").each(function(){
    var aHref = $(this).attr("href");
    $(this).attr("xlink:href", aHref);
  })
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="/node/1">link title</a>
<a href="/node/1">link title</a>
<a href="/node/1">link title</a>

jquery 将 href 转为 xlink:href

jquery turn a href to xlink:href

safari

jquery

svg

xlink