使用USE标记访问外部SVG图形

时间:2013-02-07 21:48:01

标签: svg

亲爱的Stack Overflow,

我试图引用驻留在不同SVG文件中的各个SVG图形 通过主HTML5页面中的标签和ID号。

我希望能够在HTML页面中使用onclicks中的use标签 做一个多项选择测验(然后保持我知道该怎么做的分数), 图形将变得笨重。因此,这些需要在外部svg文件中。

然而,在这里,我使用了一个简单的矩形来使我的问题更容易 遵循

这是我的HTML

<html>
<head></head>

<body>

<svg>  
<use xlink:href="LINK.svg#link" />
</svg>
</body>
</html>

这是我的SVG

<?xml version="1.0" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg">
<g id="link">
 <rect x="0" y="0" width="50" height="50" style="fill:red"/>
</g>
</svg>

这与Firefox和Opera中我想要的方式完全一致。 但是,它无法在Chrome或Safari中使用。不确定Internet Explorer

是否有一种替代方法可以让我外部访问 SVG数据和主HTML页面的脚本(因为我想要可以保持分数 多个SVG元素)

1 个答案:

答案 0 :(得分:0)

您可以使用<object>标记访问您的SVG。 This link向您展示了如何从html脚本编写为SVG,反之亦然。