javascript - 通过 javascript 在文档顶部注入(inject)该 SVG

Question

我想在我的 Angular 元素中使用 svg Sprite 。我看到 css-tricks post并在本文中提到使用 include_once 将 SVG Sprite 注入(inject)页面顶部的方法。然后像这样使用:

<svg viewBox="0 0 100 100" class="icon shape-codepen">
  <use xlink:href="#shape-codepen"></use>
</svg>

我怎样才能用 javascript 方式做到这一点？ 谢谢。

Answer 1

您可以在 body onload 上调用以下函数来实现此目的:

function loadSvgTag() {
        var svgTag = '<svg viewBox="0 0 100 100" class="icon shape-codepen">use xlink:href="#shape-codepen"></use></svg>';
        document.body.innerHTML = svgTag+document.body.innerHTML;
}