有没有一种方法可以在 sprite.svg 文件组件上应用 javascript？答案

【问题标题】：Is there a method to apply javascript on sprite.svg file components?有没有一种方法可以在 sprite.svg 文件组件上应用 javascript？
【发布时间】：2021-07-15 06:42:53
【问题描述】：

我的 sprite.SVG 文件中有一个 SVG 组件包，还有一个 HTML 页面，我在其中包含了这些 SVG 组件HTML。例如：

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

现在，我想在 svg 的组件 上应用 javascript，那么我应该怎么做，因为这些组件是在 sprite.svg 文件中定义的.

一种可能的解决方案是，我将这些精灵符号直接作为 svg 包含在我的 html 中，但我不想这样做，因为我有很多 svg，这会在 html 中占用大量空间。

那么，我可以将 GreenSock js 或简单地 (JS) 应用于 sprite.svg 文件上的动画的最佳方式是什么。

【问题讨论】：

通过 JS 为它们设置动画的唯一方法是如果您可以访问 DOM 节点，即它们是内联的 SVG。为什么不将它们内联？无论哪种方式，您都加载相同数量的数据...
@ZachSaucier 他可以像<object> 一样放置，等到svg 加载并通过contentDocument 获得访问权限

标签： javascript html css svg gsap

【解决方案1】：

当使用对象标签嵌入 svg 时，有一种方法可以在 svg 中使用 javascript。

这是一个将 javascript 动画嵌入到 svg 文件本身的示例。

https://codesandbox.io/s/inline-svg-javascript-with-object-iy2mq?file=/index.html

【讨论】：

但是这里没有对象标签。此嵌入是通过使用