特性1:正则表达式

无须使用服务端的检测,使用浏览器的本地功能,就可以帮助你判断邮箱的格式,URL,电话,防止用户输入错误的信息,通过H5的pattern属性,很方便的整合这个功能。

<input type="email" pattern="[^@]*@[^ @]*" value="">

  

特性2:数据列表元素

在H5没有出现之前,我们会选择JS或者Jquery UI来实现自动补全功能,而在H5中,可以直接使用datalist元素,如下

<form action="/server" method="post">
<input list="jslib" name="jslib">
<datalist id="jslib">
<option value="jQuery">
<option value="Dojo">
<option value="Prototype">
<option value="Angular">
</datalist>
<input type="submit" value="完成">
</form>

  

特性3:下载属性

H5允许开发者强制下载一个页面,而非加载那个页面,不需实现服务端的一些功能来达到同样的效果

<a href="download_pdf.php" download="somefile.pdf">下载PDF文件</a>

特性4:DNS的预先加载处理

由于DNS的解析成本很高,往往会导致网站的加载速度变慢。H5的处理,将域名缓存,当用户点击其他页面地址时自动获取。

<link rel="dns-prefetch" href="//www.gbtags.com"/>

  

特性5:链接网页的预先加载处理

使用H5的prefetch属性可以帮助你针对指定的地址预加载页面或者页面中的特定资源,用户点击时,会发现页面的加载速度  提高了。

<link rel="prefetch" href="http://www.gbtags.com/gb/users.htm"/>
<link rel="prefetch" href="http://www.gbtags.com/gb/networks/themes/img/logo_small.jpg"/>

  

HTML5的5个的新特性的更多相关文章

  1. HTML5和CSS3的一些新特性

    html5有哪些新特性.移除了那些元素?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和 HTML5? 新特性: 1. 拖拽释放(Drag and drop) 2. 语义化更好的内容标 ...

  2. 前端笔记之HTML5&CSS3(上)新特性&音频视频&本地存储&自定义属性

    一.HTML5简介 HTML 5 的第一份正式草案已于2008年1月22日公布.HTML5 仍处于完善之中.然而,大部分现代浏览器已经具备了某些 HTML5 支持. 2014年10月29日,万维网联盟 ...

  3. html5 新增元素以及css3新特性

    HTML5 1.HTML5 新元素 HTML5提供了新的元素来创建更好的页面结构: 标签 描述 <article> 定义页面独立的内容区域. <aside> 定义页面的侧边栏内 ...

  4. 常用的HTML5、CSS3新特性能力检测写法

    伴随着今年10月底HTML5标准版的发布,未来使用H5的场景会越来越多,这是令web开发者欢欣鼓舞的事情.然而有一个现实我们不得不看清,那就是IE系列浏览器还占有一大部分市场份额,以IE8.9为主,w ...

  5. 使用Modernizr探测HTML5/CSS3新特性(转载)

    转载地址:http://www.cnblogs.com/TomXu/archive/2011/11/18/detecting-html5-css3-features-using-modernizr.h ...

  6. 使用Modernizr探测HTML5/CSS3新特性

    [转] HTML5, CSS3以及相关技术(例如canvas和web sockets)带来了非常有用的特性,可以让我们的web程序提升一个新的level.这些新技术允许我们只用HTML,CSS和Jav ...

  7. 关于自我总结的html5新特性

    最近本包子制订了一个学校计划,第一步就是了解并总结一下html5现在所含有的新特性,好吧,这只是一个了解,- -! 自己总结了一个word文档,里面很多东西自己都还没实际用过,下一步,本包子要写pc端 ...

  8. HTML5和CSS3新特性一览

    HTML5 1.HTML5 新元素 HTML5提供了新的元素来创建更好的页面结构: 标签 描述 <article> 定义页面独立的内容区域. <aside> 定义页面的侧边栏内 ...

  9. html5新特性

    这一篇博文不会告诉你怎么去使用html5的新特性,只会给你总结一下新特性------对于好学的人可以把这篇文章当做一个目录 对于初接触的人来说是一个导向 对于已经接触过的人来说是一个检测你掌握程度的检 ...

随机推荐

  1. android中的http框架,使其更加简单易用

    Afinal 是一个android的sqlite orm 和 ioc 框架. Afinal 是一个android的sqlite orm 和 ioc 框架.同时封装了android中的http框架,使其 ...

  2. Android——app基础

    Android Application基础 系统启动过程 APK文件介绍 APK是Android Package的缩写,即android安装包.APK 文件其实是zip 格式,但后缀名被修改为apk  ...

  3. 覆盖equals时请遵守通用约定

    Object类中非final修饰的方法有equals().hashCode().toString().finalize().clone()1.equals()方法不需要被覆盖的情况:1)实例化的对象只 ...

  4. js图片压缩和上传并显示

    由于近期项目中需要做个图片压缩上传,所以就在网上找了些资料自己写了一个 html部分 <input id="file" type="file"> & ...

  5. python 布尔值索引

  6. SDUT-3379_数据结构实验之查找七:线性之哈希表

    数据结构实验之查找七:线性之哈希表 Time Limit: 1000 ms Memory Limit: 65536 KiB Problem Description 根据给定的一系列整数关键字和素数p, ...

  7. tablespaces

    select * from user_tablespaces; select username,default_tablespace from user_users;

  8. Leetcode859.Buddy Strings亲密字符串

    给定两个由小写字母构成的字符串 A 和 B ,只要我们可以通过交换 A 中的两个字母得到与 B 相等的结果,就返回 true :否则返回 false . 示例 1: 输入: A = "ab& ...

  9. malloc: *** error for object 0x10a291df8: pointer being freed was not allocated *** set a breakpoint in malloc_error_break to debug

    malloc_error_break错误: .You'll find out what the object is when you break in the debugger. Just look ...

  10. kubernetes1.4新特性:支持sysctl命令

    背景介绍 sysctl是一个允许改变正在运行中的Linux系统内核参数的接口.可以通过sysctl修改Linux系统内核中的TCP/IP 堆栈和虚拟内存系统的高级选项,而且不需要重新启动Linux系统 ...