检查浏览器是否支持SVG

我想检查浏览器是否不支持SVG。如果是的话，我想添加一个类到身体，像noSvg身体。检查浏览器是否支持SVG

一些论坛建议我添加modernizer。然而，我不想加入这个，因为它很重，我认为它不需要这个小任务。

其他一些论坛建议我下面的JavaScript

function supportsSVG(){ 
return !!('createElementNS' in document && 
    document.createElementNS('http://www.w3.org/2000/svg','svg').createSVGRect) 
}

使用我已经试过这和调用的函数。但是，我不明白真正发生了什么。任何意见，将不胜感激。提前致谢。

来源

2016-02-11 Shyam Krishna Sreekumar

我建议你将'noSVG'类添加到你的主体中，并在支持SVG时将其删除。这样，当JS被禁用或者由于任何原因而不支持SV时，你就处于安全的一边（虽然不支持SVG可能是你在这种情况下最不可能的问题......） – RobIII

尝试此，

实施例1：

if (typeof SVGRect != "undefined") { 
/* If the browser does support SVG. */ 
} else { 
/* If the browser does not support SVG. */ 
var bodyElement = document.getElementsByTagName("body")[0]; 
bodyElement.className += " noSvg"; 
}

实施例2：（检查SVG的现代化主义方式）

if(!document.implementation.hasFeature('http://www.w3.org/TR/SVG11/feature#Image', '1.1')){ 
    var bodyElement = document.getElementsByTagName("body")[0]; 
    bodyElement.className += " noSvg"; 
}

来源

2016-02-11 09:05:03

我试过你的第一个例子。然而，当检查一下警报，它在Firefox中工作。但在IE8中，这些条件并未检查。可能是什么原因？ –

IE8不支持SVG。如果你在IE8上做'alert（typeof SVGRect）'，检查你会得到什么？ –

这是较短的功能，基于上SVGRect function的存在：

function supportsSVG() { 
    return typeof SVGRect === 'function'; 
}

来源

2016-02-11 09:05:56

===函数在ie上无法正常工作，因为这被认为是一个对象。 Muthu Kumaran的解决方案是正确的，通过检查未定义。 –

检查浏览器是否支持SVG

回答

相关问题