我正在使用 grunt-svgstore 任务来创建 svg 文件的合并版本。
问题陈述:
完成 grunt-svgstore 任务后,我已经包含了 svg 文件。
我的解决方案
svg-sprite.svg
<svg style="display: none;">
<symbol viewBox="0 0 30 30" id="icon_arrow-down"><title>arrow-down</title><polygon points="24.5,7.2 15.2,17.1 5.3,7.8 2.6,10.7 15.4,22.8 27.4,10 "/></symbol>
</svg>
索引.html
<link rel="import" id="svg-file" href="/images/svg-sprite.svg">
index.html 的页脚部分
<script type="text/javascript">
var content = document.querySelector('link[rel="import"]').import;
var el = content.querySelector('svg');
document.body.insertBefore(el.cloneNode(true), document.body.firstChild);
</script>
用法
<svg>
<use xlink:href="#icon_arrow-down" />
</svg>
还有其他方法可以让我以更有效的方式编写上述代码吗?