使用iframe/object/embed引入SVG并且getSVGDocument为null的问题解决方法

在前端开发中，我们经常需要在网页中嵌入矢量图形，而SVG（可缩放矢量图形）是一种常用的格式。为了将SVG图像嵌入到网页中，我们可以使用iframe、object或embed元素。然而，有时候我们可能会遇到一个问题，就是当我们尝试访问嵌入的SVG文档的DOM时，getSVGDocument方法返回null。本文将介绍这个问题的原因，并提供解决方法。

问题原因：
getSVGDocument方法返回null的原因通常是由于同源策略（Same-Origin Policy）导致的。同源策略是浏览器的一项安全策略，用于限制一个页面中的脚本只能访问来自同一来源的资源。当我们使用iframe、object或embed元素引入外部的SVG图像时，如果SVG图像的源与当前页面的源不同，就会触发同源策略，并导致getSVGDocument方法返回null。

解决方法：
要解决这个问题，我们需要确保嵌入的SVG图像与当前页面具有相同的源。下面是几种常见的解决方法：

1. 使用相对路径：
   如果你的SVG图像位于与当前页面相同的域或子域下，可以使用相对路径来引入SVG图像。例如，如果你的SVG图像位于与当前页面相同的目录下，你可以使用相对路径引入它：

   <object data