<use>
<use> 元素从 SVG 文档中获取节点，并在其他地方复制它们。其效果与将节点深度克隆到一个未公开的 DOM 中，然后粘贴到 use 元素所在位置相同，就像克隆的 模板元素 一样。
示例
以下示例展示了如何使用 use 元素绘制一个具有不同填充和描边颜色的圆形。在最后一个圆形中，stroke="red" 将被忽略，因为描边已在 myCircle 上设置。
<svg viewBox="0 0 30 10" xmlns="http://www.w3.org/2000/svg">
<circle id="myCircle" cx="5" cy="5" r="4" stroke="blue" />
<use href="#myCircle" x="10" fill="blue" />
<use href="#myCircle" x="20" fill="white" stroke="red" />
</svg>
属性
hrefxlink:href已弃用-
需要复制的元素/片段的
<IRI>引用。如果同时存在href和xlink:href，则使用href提供的值。
值类型：<IRI>；默认值：无；可动画：是 X 坐标-
应用于
<use>元素的附加最终偏移变换的 x 坐标。
值类型：<coordinate>；默认值：0；可动画：是 Y 坐标-
应用于
<use>元素的附加最终偏移变换的 y 坐标。
值类型：<coordinate>；默认值：0；可动画：是 宽度-
use 元素的宽度。
值类型：<length>；默认值：0；可动画：是 height-
use 元素的高度。
值类型：<length>；默认值：0；可动画：是
注意：width 和 height 对 use 元素没有影响，除非引用的元素具有 viewBox，即它们仅在 use 指向 svg 或 symbol 元素时才有效。
注意：从 SVG2 开始，x、y、width 和 height 是几何属性，这意味着这些属性也可以用作该元素的 CSS 属性。
用法说明
如果相应的属性已在 use 引用的元素上定义，则 use 上的大多数属性将被忽略。（这与 CSS 样式属性如何覆盖级联中“更早”设置的属性有所不同）。只有use 元素上的 x、y、width、height 和 href 属性将在后面描述，如果引用的元素已定义了相应的属性，则可能产生一些影响。但是，任何其他未在引用的元素上设置的属性将应用于 use 元素。
由于克隆的节点未公开，因此在使用 CSS 对 use 元素及其克隆的后代进行样式设置时，必须注意。除非您使用 CSS 继承 显式请求，否则 CSS 属性不能保证会被克隆的 DOM 继承。
出于安全原因，浏览器可能会对 use 元素应用 同源策略，并可能拒绝加载 href 属性中的跨源 URL。目前没有定义的方法来为 use 元素设置跨源策略。
警告：出于安全原因，在 href 属性中使用数据 URI 加载资源已弃用。这适用于 <use href="data:... 以及使用 set 或 setAttribute 方法设置 href 时。请参阅 浏览器兼容性 表格中的“从 data: URI 加载”以检查不同浏览器版本中的支持情况。
警告：从 SVG 2 开始，xlink:href 属性已弃用，取而代之的是 href。有关更多信息，请参阅 xlink:href 页面。
使用上下文
规范
| 规范 |
|---|
| 可缩放矢量图形 (SVG) 2 # UseElement |
浏览器兼容性
BCD 表格仅在启用 JavaScript 的浏览器中加载。