我可以使用 JS 或 jQuery 来测试是否支持 SVG 图像吗？答案

【问题标题】：Can I use JS or jQuery to test if SVG images are supported?我可以使用 JS 或 jQuery 来测试是否支持 SVG 图像吗？
【发布时间】：2012-12-09 20:26:02
【问题描述】：

我在网站上使用 SVG 徽标，并且在大多数浏览器中都可以正常工作。但是，在某些 IE 版本和移动浏览器上，图像显示为失败的图像框。有没有什么办法可以使用 JS 或一些库（最好是 jQuery）来检查 SVG 兼容性，并尽量减少误报，然后简单地切换到 .png 版本的图像？

网站是这样的：http://zero31b.x10.mx/samote，SVG 图像是蓝色的小球

【问题讨论】：

gist.github.com/3202087 是一种方式。（不过它确实需要 JavaScript。）我通过查找“svg with png fallback”找到了它。
在工作中我们成功地利用了modernizr - modernizr.com。
顺便问一下，你注意到你的 SVG 是 30 kB 了吗？

【解决方案1】：

Tavmjong Bah 写了一篇关于 SVG 和 PNG 后备的综合文章：

他/她给出的最简单的代码是

    <img src="buttonA.svg" alt="A sample SVG button." 
       onerror="this.removeAttribute('onerror'); this.src='buttonA.png'"/>

但如果你有更多的功能你必须为你测试可能考虑modernizr版本。

推荐在 github 上创建你的 SVG-Button madrobby 的 png 版本使用 librsvg-convert

【讨论】：