Question

我正在寻找一种方法来测试浏览器是否可以在use元素中使用外部svg引用：

<svg>
    <use xlink:href="sprite.svg#icon-name"></use>
</svg>

这适用于大多数现代浏览器，但不适用于IE11或Edge等浏览器。而不是测试浏览器“名称”是否为“x”，我宁愿使用“功能检测”来知道我是否需要运行回退。

我无法访问use的Shadow DOM以查看是否在其中放置了外部引用，我认为我无法检测“内容”是否实际放在临时元素中引用外部svg。

例如，我无法以这种方式设置元素：

var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');

var use = document.createElementNS('http://www.w3.org/2000/svg', 'use');
use.setAttributeNS(
    'http://www.w3.org/1999/xlink',
    'xlink:href', 
    'sprite.svg#icon-name'
);

svg.appendChild(use);
document.body.appendChild(svg);

// Somehow test to see if it worked...

document.body.appendChild(svg);

实际上是否有一种方法来检测此功能，或者我是否必须检测浏览器“名称”？

检测外部svg的浏览器支持for use元素？

0 个答案: