把 img 的 svg 標籤轉成真的 svg

近年來為了解析度的關係，又流行起把圖示或一些圖案使用 svg 的方式嵌入，只是若要直接用 svg 的標籤嵌入，圖一複雜就很難維護，但如果用 img 的標籤嵌入就方便許多，但這樣就有一個問題是由於是用 img 的標籤，一些 svg 的 css 就沒辦法使用了，本來應該做些取捨，但也有更好的方式，就是把 img 的標籤再用 js 轉成原本的 svg 就好了，網路上也有好用的工具可以使用，比如這個 SVGInjector。

把 js 放入專案後，最基本的用法只要如下面這樣使用就可以了。

view plaincopy to clipboardprint

1. // Elements to inject   
2.   var mySVGsToInject = document.querySelectorAll('img.inject-me');   
3.   
4. // Do the injection   
5. SVGInjector(mySVGsToInject);  

一些進階的用法可以參考官方的說明，這樣就可以開心地使用 svg 了。

反應：