在 HTML 中包含 SVG 文件，并且仍然能够对它们应用样式? [英] Include SVG files with HTML, and still be able to apply styles to them?

查看：24
本文介绍了在 HTML 中包含 SVG 文件，并且仍然能够对它们应用样式?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

您可以通过 embed object 和 svg 标签将 SVG 文件包含到您的 HTML 文件中.

  • 使用 embed 或 object 标签需要将图像与 URL 链接.(这是我更喜欢的，因为我不喜欢 HTML 代码中的所有 SVG 代码，所以我想保持这种方式.)
  • 使用 svg 标签 (AFAIK) 需要在 HTML 代码中内嵌 SVG 代码.

我的问题是:

如何将 SVG 图标、图像和其他文件包含到我的 HTML 文件中，而不必将整个 SVG 代码放入其中，并且仍然能够对其应用样式?通过 JS 应用它们也可以.

注意:

当我通过 object 或 embed 包含它们时，我似乎无法通过 jQuery 访问它们，即使使用 $("#my-svg-div").find("svg") (顺便说一下，几乎所有关于 SO 的答案都说我应该这样做).我只是得到 undefined.

谢谢！

解决方案

简答

您可以通过编程方式内联 SVG 图像.这样的图像可以与实际的内联 <svg> 元素基本相同，包括能够对其应用样式.

如果您的 SVG 图像在 或