svg or javascript to replace url part of use-CodePudding

I have some:

<svg  role="img" area-hidden="true">
  <use href="_content/blazor/blazor.svg#chevron-right"></use>
</svg>

I want to replace chevron-right with chevron-left for all svgs in the page. How is it possible?

CodePudding user response：

Use querySelectorAll to select all the relevant elements, then change all of their hrefs

document.querySelectorAll("use").forEach(element=>{
  element.href.baseVal = element.href.baseVal.replace("chevron-right", "chevron-left")
})

<svg  role="img" area-hidden="true">
  <use href="_content/blazor/blazor.svg#chevron-right"></use>
</svg>