使用SVG图像元素链接到DOM中的SVG

我希望显示SVG图像的多个副本，而无需多次复制整个DOM表示。我试图使用

svg:image

元素实现这一点，但没有任何运气

<svg xmlns="http://www.w3.org/2000/svg" id="tiger1" viewBox="0 0 900 900" version="1.1" width="200" height="200">
    .... contents
</svg>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="tiger2" version="1.1" width="200" height="200">
    <image xlink:href="url(#tiger1)" width="200" height="200" x="0" y="0"/>
</svg>

.... 目录

问题在于，

xlink:href

似乎总是将其值解释为一个资源，因此它正在寻找一个名为“url（#tiger1）”的文件

是否有方法将

图像

与本地DOM引用一起使用？或者，是否有一种不同的技术可以重复仅存在于DOM中的SVG？

用于完整文件，

用于片段，类似这样的

<svg xmlns="http://www.w3.org/2000/svg" id="tiger1" viewBox="0 0 900 900" version="1.1" width="200" height="200">
    .... contents
</svg>
<svg  xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="tiger2" version="1.1" width="200" height="200">
  <use width="200" height="200" x="0" y="0" xlink:href="#tiger1" />
</svg>

.... 目录

谢谢。我误读了规范，认为“使用”不能用于整个元素。除了iOS上没有显示图像的Safari/Chrome之外，我尝试过的所有浏览器都使用use元素。知道为什么吗？有时这是单元问题。请记住，SVG元素中的宽度和高度应以px、em、cm等实际单位指定。当你没有提供真实的单位时，元素会猜测你的意思——通常是CSS像素。此外，“使用”元素中的单位是viewbox单位，是对原始内容位置的附加变换，而不是替换值。有时你的内容就在那里，它就在可视区域之外。这也是我一开始的想法，但在px中指定所有内容都不起作用。另外，如果我用我链接到的整个替换，它会显示得很好，所以我认为它不在可视区域之外。我被难倒了，但我一定是做错了什么。。。在进一步阅读规范之后，我怀疑这个问题与我试图从另一个SVG中引用一个SVG中的元素有关。听起来这在技术上是不允许的。另外，它明确表示不应该允许引用元素，但是如果我引用的是另一个元素，那么我在iOS上也有同样的问题。嗯，好的。我是基于这个（限制A），但可能关键是“宿主语言”是HTML。它还在下表中指出，不得引用“使用”的完整规范中定义了此行为的元素。我看到另一个地方，上面写着一个不可能在另一个里面，我也认为这是可以的。也许差异在“微小”规格中。。。我想浏览器的目标是完整的规范。。。