Javascript 空的 iframe src 是否有效?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5946607/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Is an empty iframe src valid?
提问by testndtv
I want an iframe to initially have src
as blank and then once the page loads; call a JS function and then set the src
value to an actual one..
我希望 iframe 最初src
为空白,然后在页面加载后;调用 JS 函数,然后将src
值设置为实际值。
So is <iframe src="#" />
valid OR do I need to use something else like javascript:;
, etc
所以是<iframe src="#" />
有效的还是我需要使用其他的东西javascript:;
,等等
回答by ariel
just <iframe src='about:blank'></iframe>
只是 <iframe src='about:blank'></iframe>
回答by Frédéric Hamidi
The HTML 5 working draft, section 4.8.2, says (emphasis mine):
HTML 5 工作草案,第 4.8.2 节说(强调我的):
The
src
attribute gives the address of a page that the nested browsing context is to contain. The attribute, if present, must be a valid non-empty URLpotentially surrounded by spaces.
该
src
属性给出了嵌套浏览上下文要包含的页面地址。该属性(如果存在)必须是可能被空格包围的有效非空 URL。
According to RFC 3986, valid URLs must begin with a scheme name, and relative references cannot only consist in a fragment.
根据RFC 3986,有效的 URL 必须以方案名称开头,并且相对引用不能只包含在片段中。
Therefore, #
is not a valid URL, and should not be used as the value of the src
attribute.
因此,#
不是有效的 URL,不应用作src
属性的值。
Use about:blankinstead.
使用about:blank代替。
回答by Aron Rotteveel
No, it is not validto specify an empty iframe src.
不,指定空 iframe src无效。
You should use <iframe src="about:blank" />
.
你应该使用<iframe src="about:blank" />
.
#
is ment to be a reference to an anchor within the current page(or, often used as a routing scheme when working with AJAX requests). Using it as the source of an iframe would be senseless, since an iframe does not reference content on the current page and is not used with AJAX requests.
#
是对当前页面中锚点的引用(或者,在处理 AJAX 请求时通常用作路由方案)。使用它作为 iframe 的源是没有意义的,因为 iframe 不引用当前页面上的内容,也不用于 AJAX 请求。
about:blank
is a cross-browser standardto display a blank document.
about:blank
是显示空白文档的跨浏览器标准。
Update June 8th 2012:
2012 年 6 月 8 日更新:
It seems that the 'living' specno longer renders an iframe invalid if the src
attribute is missing:
如果缺少该属性,“活动”规范似乎不再使 iframe 无效src
:
If, when the element is created, the srcdoc attribute is not set, and the src attribute is either also not set or set but its value cannot be resolved, the browsing context will remain at the initial about:blank page.
如果在创建元素时未设置 srcdoc 属性,并且 src 属性也未设置或设置但其值无法解析,则浏览上下文将保留在初始 about:blank 页面。
If both of these attributes, however, are not set, the browsing context will default to about:blank
. To provide proper backwards compatibility, it's recommendable to be verbose and, for now, provide the about:blank
url.
但是,如果未设置这两个属性,则浏览上下文将默认为about:blank
。为了提供适当的向后兼容性,建议详细说明,现在提供about:blank
url。
回答by rjmunro
It looks like you can also leave out the src completely:
看起来您也可以完全省略 src :
http://dev.w3.org/html5/spec/Overview.html#the-iframe-element
http://dev.w3.org/html5/spec/Overview.html#the-iframe-element
If, when the element is created, the srcdoc attribute is not set, and the src attribute is either also not setor set but its value cannot be resolved, the browsing context will remain at the initial about:blank page.
如果在创建元素时未设置srcdoc 属性,并且 src 属性也未设置或设置但其值无法解析,则浏览上下文将保留在初始 about:blank 页面。
回答by SaidbakR
If you don't want to use about:blank
you may use javascript as an src
for your iframe
like the following example:
如果你不想使用about:blank
你可以使用 javascript 作为src
你iframe
喜欢下面的例子:
<iframe name="TV" id="tv" style="width:100%; background: #800000" src="javascript:document.write('<h3>Results Window</h3>')"></iframe>
The above example will initialize an iframe
with maroon background that has a simple message <h3>Results Window</h3>
. However, the targets of your links should equals the iframe
name
attribute i.e in that example TV
.
上面的例子将初始化一个iframe
带有简单消息的栗色背景<h3>Results Window</h3>
。但是,您链接的目标应该等于该iframe
name
示例中的属性 ie TV
。
Notice:
注意:
Some external website may block requesting their pages from another origin. Try to change the URLs of the hyperlinks in the example below to yahoo.com
or google.com
, for example, and checkout your browser's console.
某些外部网站可能会阻止从其他来源请求其页面。例如,尝试将以下示例中的超链接的 URL 更改为yahoo.com
或google.com
,然后查看浏览器的控制台。
回答by Selay
As part of the about URI scheme standard, about:blank is probably the best option as it has very good browser support.
作为 about URI 方案标准的一部分,about:blank 可能是最好的选择,因为它具有非常好的浏览器支持。
about:blank Returns a blank HTML document with the media type text/html and character encoding UTF-8. This is widely used to load blank pages into browsing contexts, such as iframes within HTML, which may then be modified by scripts. You can see further here
about:blank 返回媒体类型为 text/html 和字符编码为 UTF-8 的空白 HTML 文档。这被广泛用于将空白页面加载到浏览上下文中,例如 HTML 中的 iframe,然后可以通过脚本进行修改。 你可以在这里看到更多
回答by Naveed Butt
You can use about:blank
in the src
attribute (as mentioned by ariel earlier), otherwise it would throw an error when serving from a secure page.
您可以about:blank
在src
属性中使用(如 ariel 之前提到的),否则从安全页面提供服务时会引发错误。
A secure page https
would throw an error of possibly un-secure data on the secure website.
安全页面https
会在安全网站上抛出可能不安全数据的错误。
回答by whostolemyhat
You could try adding the iframe through Javascript, so you wouldn't need to have a blank one in the HTML:
您可以尝试通过 Javascript 添加 iframe,这样您就不需要在 HTML 中有一个空白的:
(jQuery example)
(jQuery 示例)
<script type="text/javascript">
$().ready(function() {
$("<iframe />").attr("src", "http://www.bbc.co.uk/").appendTo("body");
});
</script>
Adding the iframe with Javascript allows graceful degradation - users without Javascript won't see a blank iframe.
添加带有 Javascript 的 iframe 允许优雅降级 - 没有 Javascript 的用户不会看到空白的 iframe。
回答by magallanes
For the record
作为记录
Let's say the next example (Firefox 58 but may be its present in all browsers).
假设下一个示例(Firefox 58,但可能存在于所有浏览器中)。
<link href="css.css" rel="stylesheet" type="text/css"/>
<iframe src='about:blank'></iframe>
Iframe is loaded BEFORE the css so the render of the page is visible before the css is loaded. I.e. for a split of a second, the page looks without a css.
iframe 在 css 之前加载,因此页面的渲染在 css 加载之前是可见的。即一瞬间,页面看起来没有 css。
Instead:
反而:
<link href="css.css" rel="stylesheet" type="text/css"/>
<iframe src='blank.html'></iframe>
It works fine, the css is loaded and the iframe is loaded finally.
它工作正常,加载了 css,最后加载了 iframe。