我经常使用嵌入式SVG来保持使用CSS对其进行操作的能力-无论是用于悬停效果还是动画。
通常有些SVG可能会很大,一旦您开始在页面上获取一些SVG,不仅代码变得凌乱,而且浏览器需要加载更多数据(因为我的理解是内联SVG不会这样做) t缓存)。
我遇到了以下通过iframe加载SVG,然后删除iframe的实现。当您获得内嵌svg的好处以及通过单个文件控制该SVG的好处(应该进行更改或编辑)时,它看起来很整洁。
Loading svg via iframe codepen
<iframe src="signal.svg" onload="this.before(this.contentDocument.children[0]); this.remove();"></iframe>
从安全角度来看,此方法安全吗?我知道iframe会受到很多打击,我不能说我曾经使用过iframe,但是使用iframe是否有问题?是否有其他方法可以在没有iframe的情况下实现同一目的,并保持通过CSS操纵SVG的能力?