【转】DataURL在Web浏览器中的兼容性总结
- IE8+,Firefox,Chrome,Opera,Safari 等现代浏览器普遍支持data URL
- IE8 data URL 最大长度限制为32k字节,超出无效。IE9+没有这个限制
- IE只识别base64编码或百分号编码(URL编码, encodeURIComponent)的data URL,IE不识别无编码的data URL,非IE浏览器可识别无编码的data URL
- IE不支持对<iframe>,<frame>标签的src设置data URL
- IE官方说法说data URL仅支持以下5种使用场景:
- object (images only)
- img
- input type=image
- link
- CSS declarations that accept a URL
- 据本人实测,IE也在除了官方所述5种之外的其它场合支持data URL:
- a href
- meta refresh. 示例:
- <meta http-equiv="refresh" content="5;URL=data:text/html;base64,xxxx....">
- script src
- window.open
- embed src
- 对于audio, video一类的元素,往往资源文件较大,使用data URL并不常见,我也没有对其进行测试。
- Firefox中粘贴截图是直接转换为data URL的图片,其它浏览器干脆无法粘贴,我记得以前Chrome好像可以粘贴截图的,今天再测Chrome,Opera都不能粘贴截图(<div contenteditable></div>做的测试). (粘贴截图常用于在线富文本编辑器)
- 可为data URL指定字符集编码。示例:data:text/plain;charset=US-ASCII,xxxx....
附录:
DataURL语法规则:
dataurl := "data:" [ mediatype ] [ ";base64" ] "," data
mediatype := [ type "/" subtype ] *( ";" parameter )
data := *urlchar
parameter := attribute "=" value
DataURL规范:rfc2397
维基百科词条:Data URI scheme
最好的在线生成DataURL网站:Data Url Maker 页面简洁,支持文件拖放,支持对指定网址的CSS文件做data URL优化。
from:http://blog.csdn.net/cuixiping/article/details/14215947
【转】DataURL在Web浏览器中的兼容性总结的更多相关文章
- 第十一章:WEB浏览器中的javascript
客户端javascript涵盖在本系列的第二部分第10章,主要讲解javascript是如何在web浏览器中实现的,这些章节介绍了大量的脚本宿主对象,这些对象可以表示浏览器窗口.文档树的内容.这些章节 ...
- JavaScript权威指南--WEB浏览器中的javascript
知识要点 1.客户端javascript window对象是所有客户端javascript特性和API的主要接入点.它表示web浏览器的一个窗口或窗体,并且可以用window表示来引用它.window ...
- web浏览器中的javascript 1
Html 文档嵌入客户端有4种方式. 1. 内联.放置在<script>和</script>标签对之间. 2.放置在<script>标签的src属性指定的外部文件中 ...
- web浏览器中的javascript -- 2
在html里嵌入javascript: 在html文档里嵌入客户端javascript代码有4种方式: 1.内联,放置在<script>和</script>标签对之间; 2.放 ...
- 在web浏览器中判断app是否安装并直接打开
最近公司App产品在运营推广上有一个需求,就是要求可以让用户在访问我们的推广网页时,就可以判断出这个用户手机上是否安装了我们的App,如果安装了则可以直接在网页上打开,否则就引导用户前往下载.从而形成 ...
- web浏览器中javascript
1.异步载入一个js代码function loadasync(url) { var head = document.getElementsByTagName("head")[0]; ...
- websocketj--随时随地在Web浏览器中操作你的服务端程序
0 - 有没有觉得Linux标准终端界面输入输出枯燥无味? 1 - 什么?vmstat命令的输出数据不直观?有没有想过能够可视化该命令的输出? 2 - 尝试过用浏览器操作Windows中的cmd吗? ...
- 谷歌开发人员在现代Web浏览器中发现严重跨域漏洞
Google谷歌研究人员在现代网络浏览器中发现了一个严重漏洞,该漏洞可能允许您访问的网站从您登录同一浏览器的其他网站窃取您的在线帐户的敏感内容. 由Google谷歌Chrome的开发者支持者Jake发 ...
- cssRules在不同浏览器中的兼容性
在一份HTML文档中可以用三种方式添加样式信息: 1.通过<link>元素引用外部样式表: 2.通过<style>元素在文档的头部添加样式信息: 3.在具体的文档元素上通过st ...
随机推荐
- servlet3
亿级流量架构 http://www.iteye.com/blogs/subjects/as-core servlet3.1对比 http://jinnianshilongnian.iteye.com/ ...
- VSCode个人实用插件
1.汉化插件 Chinese (Simplified) Language Pack for Visual Studio Code 发布者:Microsoft 2.主题插件(IDEA主题) Darcul ...
- mobiscroll 日期问题
做的一个项目中用到了mobiscroll日期控件,设置距离当前日期往前推一个月的时间出现如下图问题 弹出窗默认的年份不对,后来查找原因是初始化属性配置有问题,应该将设置为dateFormat:'yy- ...
- Surface Shader(表面着色器)
Shader "Custom/Surface_Shadeer" { Properties { ...
- how to use Eclipse with Maven
install Eclipse LUNA; download and unzip Maven; Eclipse=>window=>preference=>maven=>inst ...
- xubuntu 安装一款漂亮的图标
sudo add-apt-repository ppa:noobslab/icons sudo apt-get update sudo apt-get install square-beam-icon ...
- 使用CSS选择器进行元素定位
在selenium webdriver中,支持使用CSS选择器来进行元素定位,事实在真的投入工作,大量编辑用例和元素定位的时候,使用css 和 xpath才是经常需要用到的. 之前有专门讲过使用xpa ...
- 四、Oracle loop循环、while循环、for循环、if选择和case选择、更改读取数据、游标、触发器、存储过程
数据库的设计(DataBase Design): 针对于用户特定的需求,然后我们创建出来一个最使用而且性能高的数据库! 数据库设计的步骤: 01.需求分析 02.概念结构设计 03.逻辑结构设计 04 ...
- Java并发包concurrent类简析
1.ConcurrentHashMap ConcurrentHashMap是线程安全的HashMap的实现. 1)添加 put(Object key , Object value) Concurren ...
- 设计模式在Spring
设计模式在spring中的使用1.工厂模式,这个很明显,在各种BeanFactory以及ApplicationContext创建中都用到了:2.模版模式,这个也很明显,在各种BeanFactory以及 ...