srcdoc =“...”之间的区别是什么？和src =" data：text / html，..."在< iframe>中？ [英] Which is the difference between srcdoc="..." and src="data:text/html,..." in an <iframe>?

问题描述

例如，这些区别在于：

 < iframe srcdoc =< p>一些HTML< p> / p>中>< / iframe中> 
< iframe src =data：text / html，< p>一些HTML< / p>>< / iframe> 
  

演示

如果它们完全相同，为什么HTML5会添加 srcdoc 属性？

编辑 可能我不是'不够清楚。我没有比较 src 和 srcdoc ，但是 src 使用文本/ html数据URI与 srcdoc 。

然后，如果功能图是这样的

 
 | src属性| srcdoc属性
 -------------------------------------------- ------------------------ 
 URL |是|否，不使用src（*）
 HTML内容|是的，使用数据URI |是
 

为什么需要 srcdoc ？

（*）注意：

看起来 srcdoc 可用于通过URL加载页面（ Demo ） ，使用具有 src 属性的子图框：

 < iframe srcdoc = < iframe src ='http：//microsoft.com'>< / iframe>>< / iframe> 
  

解决方案

其他答案列出了一些肤浅的区别，

< em>浏览器/规格编写者为什么会重复已存在的内容：

; iframe src =data：...不受信任的内容sandbox /> < - 在现代浏览器中安全，不安全 >
$ b

< iframe srcdoc =...不可信内容沙箱/> < - 在现代浏览器中安全， strong>安全（虽然不起作用）在传统浏览器中

这种新语法为内容作者提供了一种保护用户的方法，即使他们可能正在使用传统浏览器。没有它，内容作者根本不愿意使用沙箱功能，也不会看到使用。

For example, which is the difference between these:

<iframe srcdoc="<p>Some HTML</p>"></iframe>
<iframe src="data:text/html,<p>Some HTML</p>"></iframe>

Demo

And, in case they are exactly the same, why did HTML5 add srcdoc attribute?

Edit

Maybe I wasn't clear enough. I am not comparing src with srcdoc, but src using text/html data URI with srcdoc.

Then, if the functionality chart is like this

                   |  src attribute       |  srcdoc attribute
 --------------------------------------------------------------------
  URL              |  Yes                 |  No without using src (*)
  HTML content     |  Yes, using data URI |  Yes

why is srcdoc needed?

---

(*) Note:

It seems srcdoc can be used to load a page by URL (Demo), using a subiframe with srcattribute:

<iframe srcdoc="<iframe src='http://microsoft.com'></iframe>"></iframe>

解决方案

The other answers list some superficial differences, but really miss the mark of the key difference that explains why browsers/spec writers would essentially duplicate something that already exists:

<iframe src="data:...untrusted content" sandbox /> <- Secure in modern browsers, insecure in legacy browsers with no sandbox support

<iframe srcdoc="...untrusted content" sandbox /> <- Secure in modern browsers, secure (though non-functional) in legacy browsers

This new syntax provides content authors a way to protect their users, even when they may be using legacy browsers. Without it, content authors would be reluctant to use the sandbox feature at all, and it would not see use.

这篇关于srcdoc =“...”之间的区别是什么？和src =&quot; data：text / html，...&quot;在&lt; iframe&gt;中？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！