¿Qué método de detección de soporte SVG es el mejor?

Alguien ya tiene asked my question about detecting SVG support in browsers pero hay tres soluciones líderes y no mucha discusión sobre los méritos de cada una.¿Qué método de detección de soporte SVG es el mejor?

Entonces, ¿cuál, en su caso, es la mejor? En términos de portabilidad y corrección, eso es. Los negativos falsos (es decir, "no svg") no son deseables, pero son aceptables; los falsos positivos no lo son.

Prueba A:

var testImg = 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNzUiIGhlaWdodD0iMjc1Ij48L3N2Zz4%3D'; 

var img = document.createElement('img') 

img.setAttribute('src',testImg); 

return img.complete;

Prueba B:

return document.implementation.hasFeature(
    "http://www.w3.org/TR/SVG11/feature#BasicStructure", "1.1");

Anexo C:

return !! document.createElementNS && 
     !! document.createElementNS (
      'http://www.w3.org/2000/svg', 
      "svg") 
     .createSVGRect;

Fuente

2012-03-13 spraff

¿Cuáles son sus criterios de aptitud para el 'mejor'? Tal vez deba modificar su pregunta y título para formular preguntas específicas que responden como _ "¿Fallará alguno de ellos (arrojará un resultado falso negativo o positivo) en los navegadores lanzados en los últimos 3 años?" _ O algo por el estilo. De lo contrario, esta pregunta está madura para el cierre como subjetivo. – Phrogz

-1

que probablemente utilice modernizr.

Fuente

2012-03-13 17:50:45 Magrangs

+10

Parece que es lo mismo que C debajo. – spraff

No es una respuesta muy útil, a menos que le interese explicar qué método usa modernizr y por qué es mejor. La detección de características no necesita depender de una biblioteca, y la biblioteca debe usar algún tipo de detección. –

Actualmente, Modernizr utiliza el enfoque B para detectar apoyo para el IVS en <img> etiquetas, y el enfoque C para detectar apoyo para el IVS en <embed> y <object> etiquetas. Parece que solía usar un enfoque que era más como A para detectar el soporte "SVG como img", pero que se descartó a favor de B (para más detalles, vea this post en CSS-trucos).

En consecuencia, parece que en este momento, ya sea B o C sería el mejor enfoque, dependiendo de lo que exactamente quiere probar.

Fuente

2014-11-05 09:44:07

No es necesario incluir toda la biblioteca de Modernizr para esto. He aquí una simple comprobación de que tengo que he utilizado en el pasado:

typeof SVGRect !== "undefined"; // true if supported, false if not

Esto simplemente comprueba el apoyo del objeto SVGRect que se define en el SVG Specification. En Chrome typeof SVGRect es "function" y en IE9 es "object", pero en los navegadores que no son compatibles con SVG (IE8, por ejemplo) esto devuelve "undefined".

Con el código anterior, puede simplemente:

if (typeof SVGRect !== "undefined") { ... /* If the browser does support SVG. */ } 
else { ... /* If the browser does not support SVG. */ }

Fuente

2015-01-30 15:37:06

¿Qué método de detección de soporte SVG es el mejor?

Respuesta

Cuestiones relacionadas