Question

我在SVG中使用foreignObject元素，但IE9不支持此元素。我正在寻找一种检测此功能的方法。 Modernizr没有检测到这个功能，似乎我不能像使用矩形（createSVGRect）那样使用createSVGForeignObject（在SVGSVGElement上不可用）。

谢谢！

Answer 1

如果你想使用foreignObject，这应该有效，因为它集成了html内容......

<switch>
  <g requiredFeatures="http://www.w3.org/TR/SVG11/feature#Extensibility" requiredExtensions="http://www.w3.org/1999/xhtml">
    <foreignObject >
    </foreignObject>
  </g>
  <text font-size="10" font-family="Verdana">
     No foreignObject
  </text>
</switch>

requiredExtensions部分proposed to w3c和this was their response。 Firefox确实实现了这一点，但我还没有测试过其他任何东西。正如Erik建议的那样，您可以只使用requiredFeatures属性。

如果你想在javascript中试试

var supported = document.implementation.hasFeature("www.http://w3.org/TR/SVG11/feature#Extensibility","1.1"); –

Answer 2

有一种方法可以在JS中测试这个功能，以下内容是从最近提交给modernizr（https://github.com/Modernizr/Modernizr/commit/ee836f083f29a9e634df731400027c24630a75f3）中借来的：

        var toStringFnc = ({}).toString;
        Modernizr.addTest('svgforeignobject', function() {
            return !!document.createElementNS &&
                /SVGForeignObject/.test(toStringFnc.call(document.createElementNS('http://www.w3.org/2000/svg', 'foreignObject')));
        });

SVG中foreignObject的特征检测

2 个答案: