我可以使用JS或jQuery来测试SVG图像是否已加载？

Question

我在网站上使用SVG徽标,在大多数浏览器中它工作正常.但是,在某些IE版本和移动浏览器上,图像显示为失败的图像框.有没有什么方法可以使用JS或一些库(最好是jQuery)来检查SVG与最少量的漏报的兼容性,并简单地切换到图像的.png版本？

该网站是这样的:http://zero31b.x10.mx/samote,而SVG图片是小蓝球的东西

Answer 1

Tavmjong Bah 撰写了有关 SVG 和 PNG 后备的综合文章：

http://tavmjong.free.fr/SVG/BUTTON_TEST/button_test.html

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

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

但如果您有更多功能需要测试，您可能会考虑 Modernizr 版本。

要在 github 上创建 SVG 按钮 madrobby 的 png 版本，建议使用librsvg-convert