功能检测支持svg过滤器

Question

我需要检测浏览器是否支持svg过滤器（feGaussianBlur，具体）。我将如何进行此测试？ Safari不支持过滤器，会默默地忽略过滤器。

Answer 1

您也可以检查界面上可用的枚举，例如：

var supportsfilter = typeof SVGFEColorMatrixElement !== undefined && 
                     SVGFEColorMatrixElement.SVG_FECOLORMATRIX_TYPE_SATURATE==2;

这样你就不必像https://stackoverflow.com/a/9767059/109374那样构建新的元素。我没有测试过看看它是否在Safari中正常工作。

<强>更新 补丁提交给modernizr：https://github.com/Modernizr/Modernizr/pull/531

Answer 2

我创建了一个小提琴http://jsfiddle.net/yxVSe/，它检查了GaussianBlur属性的存在。 假设GaussianBlur有一个方法setStdDeviation，我们检查该方法的存在，当失败时我们得出结论，当前的浏览器剂量支持该过滤器。

当这个小提琴被检查时，徒步旅行文本将是红色的，而在Firefox中它将是绿色。

Answer 3

我为遗留的Androids bug添加了一个小修改

var supportsfilter = window['SVGFEColorMatrixElement'] !== undefined && SVGFEColorMatrixElement.SVG_FECOLORMATRIX_TYPE_SATURATE == 2