HTML <iframe> 标签的 srcdoc 属性 详解
HTML基础 2022-06-02 12:01:41小码哥的IT人生shichen
HTML <iframe> 标签的 srcdoc 属性
实例
带有 srcdoc 属性的 <iframe>：
<iframe srcdoc="<p>Hello world!</p>" src="demo_iframe_srcdoc.htm"></iframe>
完整实例【亲自试一试】：
<!DOCTYPE html>
<html>
<body>
<iframe srcdoc="<p>Hello world!</p>" src="/demo/demo_iframe_srcdoc.html">
<p>Your browser does not support iframes.</p>
</iframe>
<p><b>注释：</b>所有主流浏览器都支持 srcdoc 属性，除了 Internet Explorer。</p>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
浏览器支持
| IE | Firefox | Chrome | Safari | Opera |
|---|---|---|---|---|
所有主流浏览器都支持 srcdoc 属性，除了 Internet Explorer。
注释：Opera 12 以及更早的版本不支持 srcdoc 属性，Safari 5 以及更早的版本也不支持该属性。
定义和用法
srcdoc 属性规定页面的 HTML 内容显示在行内框架中。
提示：该属性与 sandbox 和 seamless 属性一同使用。
如果浏览器不支持 srcdoc 属性，则将覆盖在 src 属性（若已设置）中规定的内容。
如果浏览器不支持 srcdoc 属性，则相应地会显示在 src 属性（若已设置）中规定的文件。
HTML 4.01 与 HTML 5 之间的差异
srcdoc 是 HTML5 中的新属性。
语法
<iframe srcdoc="HTML_code">
属性值
| 值 | 描述 |
|---|---|
| HTML_code | 显示在框架中的 HTML 内容。必须是有效的 HTML 语法。 |
