Max*_*Max 108 html iframe frame
这个IFRAME的标准代码,有没有办法用Just html代码替换src URL?所以我的问题很简单,我有一个页面它从MYSQL加载一个HTML主体我想在框架中呈现该代码,因此它使它自己独立于页面的其余部分,并在特定边界的范围内.
<iframe src="http://example.com" name="test" height="120" width="600">You need a Frames Capable browser to view this content.</iframe>
Run Code Online (Sandbox Code Playgroud)
lon*_*day 131
您可以使用数据URL执行此操作.这包括整个文档在单个HTML字符串中.例如,以下HTML:
<html><body>foo</body></html>
Run Code Online (Sandbox Code Playgroud)
可以编码为:
data:text/html;charset=utf-8,%3Chtml%3E%3Cbody%3Efoo%3C/body%3E%3C/html%3E
Run Code Online (Sandbox Code Playgroud)
然后设置为src
iframe 的属性. 例子.
编辑:另一种选择是使用Javascript执行此操作.这几乎可以肯定是我选择的技术.您无法保证浏览器接受的数据URL有多长.Javascript技术看起来像这样:
var iframe = document.getElementById('foo'),
iframedoc = iframe.contentDocument || iframe.contentWindow.document;
iframedoc.body.innerHTML = 'Hello world';
Run Code Online (Sandbox Code Playgroud)
编辑2(2017年12月):使用Html5的srcdoc属性,就像在Saurabh Chandra Patel的回答中一样,现在应该是接受的答案!如果您可以有效地检测IE/Edge,那么一个提示是仅为它们使用srcdoc-polyfill库,并在所有非IE/Edge浏览器中使用"纯"srcdoc属性(请确保caniuse.com).
<iframe srcdoc="<html><body>Hello, <b>world</b>.</body></html>"></iframe>
Run Code Online (Sandbox Code Playgroud)
Sau*_*tel 69
使用html5 srcdoc-polyfill 文档
<iframe srcdoc="<html><body>Hello, <b>world</b>.</body></html>"></iframe>
Run Code Online (Sandbox Code Playgroud)
浏览器支持
Microsoft Internet Explorer
6, 7, 8, 9, 10, 11
Microsoft Edge
13, 14
Safari
4, 5.0, 5.1 ,6, 6.2, 7.1, 8, 9.1, 10
Google Chrome
14, 15, 16, 17, 18, 19, 20, 21, 22, 23, 24.0.1312.5 (beta), 25.0.1364.5 (dev), 55
Opera
11.1, 11.5, 11.6, 12.10, 12.11 (beta) , 42
Mozilla FireFox
3.0, 3.6, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18 (beta), 50
Run Code Online (Sandbox Code Playgroud)
And*_*wan 19
根据W3Schools,HTML 5允许您使用新的"srcdoc"属性执行此操作,但浏览器支持似乎非常有限.