Search code examples
jquerysvgsafarixlink

jquery turn a href to xlink:href

I am trying to implement the following rewrite of links inside svg:

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

to

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

As these kind of links will not work on safari without the XLINK part.

I tried altering drupal views that generates these links for my site, but the system for security reasons, omits all attributes and links get printed as href only.

My only option is to alter the result with but so far I have not had any success.

Solution

  • Use function .attr(), then you will be able to add any kind of attributes 

    $(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>