Iframe相对路径挑战 [英] Iframe Relative Paths Challenge
问题描述
我有一个页面，页面内有一个Iframe。目录如下：
Folder1
Folder2
IframeCSS
IframeCSS.Css
iframePage1.html
stuff.css
parentPage1.html
iframePage通过使用相对链接引用 IframeCSS.Css ，所以 /IframeCss/IframeCSS.Css
由于应用程序的性质，我无法通过硬代码更改iframe页面的链接（修改物理iFrame Html页面）
总体目标是获得 iframePage1.html 以查看 IframeCSS.Css （以及所有其他通过相对链接（ href =/ IframeCSS / IframeCss.Css）
有一个hrefs / src's我尝试过的几件事：
-
动态添加Iframe的基本路径
这样做失败了，因为基础只能在iframe加载之后添加，因此使得链接的行为就好像基础没有存在
-
创建一个容器Iframe以获取HTML，添加Base并将内容复制到显示的Iframe中
由于上述原因，上述原因失败，此方法也会导致Google Map API被加载的问题。
通过容器iframe，使用jquery，将父根附加到所有src和hrefs以更改url
这也失败了。
你们建议我在这一点上做什么？
父HTML：
<！DOCTYPE html>
< html xmlns =http://www.w3.org/1999/xhtml>
< head runat =server>
< link rel =stylesheethref =cmsCSS / CmsStyle.css/>
< title>< / title>
< script src =// ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js\"> ;</script>
< script src =CmsScript.js>< / script>
< script src =Insights.js>< / script>
< / head>
< body id =Dash>
< form id =form1runat =server>
< div id =topDash>
< img id =somethingsrc =img / logo.png/>
< / div>
< / form>
< iframe id =dashBody>< / iframe>
< iframe id =iframeContainer>< / iframe>
< / body>
< / html>
在同一个域中引用页面是不可能的因为即使没有iframe，页面也不会与相对文件路径一起工作：
Folder1
Folder2
IframeCSS
IframeCSS.Css
iframePage1.html
stuff.css
parentPage1.html
如果您通过键入 domain.com/Folder1/Folder2/IframePage1.html
访问该页面，则该页面将不起作用因为IframePage1.html正试图访问CSS：
href =/ IframeCSS / IframeCss.Css
这意味着它正在寻找 domain.com/IframeCSS/IframeCss.Css 并基于我提供的文件结构，它根本就不存在。
我试图做的只是以某种方式更改Hrefs和src的整个iframePage而不是寻找 解决方案是将 I have a page and within the page I have an Iframe. The directory is as follows: In the iframePage it is referencing the Due to the nature of the application, I am unable to change the link of the iframe page via hard code (Modifying the physical iFrame Html Page) The overall goal is to get There are a couple of things I've tried: Dynamically add a base path to the Iframe This failed because the base can only be added AFTER the iframe loads thus making the links act as if base did not exists Create a container Iframe to get the HTML, add the Base, and copy over the Contents over to the displayed Iframe This failed because of the reason above, this method also causes issues with Google Map API's being loaded in as well Go through the container iframe, using jquery, append the parent root to all src's and hrefs's to change the url This also failed. What would you guys suggest I do at this point? (The iframe points to the same domain AND the user needs to be able to navigate through the iframe) parent HTML:
referencing a page within the same domain is simply not possible because even without the iframe, the page would not work with the relative file path: If you accessed the page by typing in which means that it is looking for What I was attempting to do was to simply somehow change the Hrefs and src's of the entire iframePage to instead of looking for The solution to this is to put the contents of 这篇关于Iframe相对路径挑战的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！ domain.com/IframeCSS/IframeCss.Css ，它会更正链接并在 domain.com/Folder1/Folder2/IframePage1.html 取而代之。
Folder2 的内容放在根目录中，然后创建一个包含 parentPage1.html 的新根目录中的新目录。这样，文件路径不需要改变。 Folder1
Folder2
IframeCSS
IframeCSS.Css
iframePage1.html
stuff.css
parentPage1.html
IframeCSS.Css by use of relative link so /IframeCss/IframeCSS.CssiframePage1.html to see IframeCSS.Css (and all other hrefs/src's) through relative links (href="/IframeCSS/IframeCss.Css")
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<link rel="stylesheet" href="cmsCSS/CmsStyle.css" />
<title></title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="CmsScript.js"></script>
<script src="Insights.js"></script>
</head>
<body id="Dash">
<form id="form1" runat="server">
<div id="topDash">
<img id="something" src="img/logo.png" />
</div>
</form>
<iframe id="dashBody"></iframe>
<iframe id="iframeContainer"></iframe>
</body>
</html>
Folder1
Folder2
IframeCSS
IframeCSS.Css
iframePage1.html
stuff.css
parentPage1.html
domain.com/Folder1/Folder2/IframePage1.html
the page will not work because IframePage1.html is trying to access the css with:href="/IframeCSS/IframeCss.Css"
domain.com/IframeCSS/IframeCss.Css and based on the file structure I provided, It simply does not exist.domain.com/IframeCSS/IframeCss.Css, it would correct the link and search it in domain.com/Folder1/Folder2/IframePage1.html instead.Folder2 in the root directory, and create a new directory within the new root that contains the parentPage1.html. This way, file paths need not to be changed.
