Javascript 只有当iframe包含SVG时，div才会显示在iframe后面

我正在构建一个离线解决方案，它采用SVG并将其嵌入到网页上，然后处理SVG元素的颜色等

在IE10问世之前，我一直在使用AJAX从本地文件夹中获取SVG，然后将其写回页面，然后将其拉入DOM，一切正常。 然而，一旦IE10问世，他们就可以在本地文件上使用AJAX进行安全保护，这些文件被描述为“按设计工作”。更改文件夹和浏览器周围的任何安全设置都不是一个选项

好消息是，我在网上找到了一个解决方案，您可以在其中创建一个iframe，并将其源代码设置为要拉入的SVG（此处设置为变量path和file）：

编辑 我不必要地把这里的事情复杂化了。问题的关键在于，除非iframe包含SVG，否则我可以将iframe的绝对位置div浮动到fine之上

另一次编辑 我认为只有在本地运行页面而不是在服务器上运行页面时才会发生这种情况

又一次编辑 如果将SVG保存为XML文件并加载该文件，div将显示iframe的overtop。这似乎只是一个SVG的东西

---

不确定是否有办法解决此问题。

您是否尝试过在iframe中插入任何“标准”内容（例如，任何外部网站）？如果是这样，它的行为是否相同？不，事实上，如果我用外部网站替换iframe，覆盖显示良好。您的图像中有任何SVG过滤器吗？如果是这样，暂时移除它们，看看问题是否得到解决。这也不起作用。在完成所有子文档编码之后，我尝试将div附加到主体中，但它仍然出现在svg后面。

<iframe class="' + eN + '" src="' + path + file + '" width="' + w + '" height="' + h + '" style="border:0;z-index:1;display:none;"></iframe>