网站首页 语言 会计 互联网计算机 医学 学历 职场 文艺体育 范文
当前位置:学识谷 > 设计制作 > 网页设计

HTML5的5个特点讲解

栏目: 网页设计 / 发布于: / 人气:2.32W

HTML5出现已经有一段时间了,它为移动和桌面程序新增加了很多新的令人兴奋的JavaScript和HTML的API。所以在YJBYS小编分享的这篇文章中,你会发现一些HTML5功能将提高你的Web应用程序,并会为你节省大量时间。

HTML5的5个特点讲解

  DNS预提取

DNS主机名解析,是任何网站变慢的原因之一。现代浏览器开始变得很智能,当涉及到DNS解析时,浏览器将会在用户点击网页上链接之前,尝试解析域名并缓存。

DNS预提取功能可以由你手动操作控制,告诉浏览器需要解析的域名:

<link rel="dns-prefetch" href="//">

<link rel="dns-prefetch" href="//">

<link rel="dns-prefetch" href="//">

<link rel="dns-prefetch" href="//">

  链接预提取

链接预提取功能允许开发人员指定他们想要预加载的页面和资源悄悄地加载一次,像加载搜索结果的第一页:

<link rel="prefetch" href="" />

<link rel="prefetch" href="http://daker.me/assets/images/avatar.png" />

您也可以使用预渲染功能,将让你的网站变得更快,浏览器将获取和渲染整个翻页,只有当用户点击链接时才显现出来:

<link rel="prerender" href="" />

  下载属性

HTML5的下载属性使开发人员能够实现文件强制下载,而不是去到特定的页面,要做到这一点不再需要依赖于服务器端的代码。

<a href="download_ download="">Download PDF</a>

  正则表达式

我知道你会爱上这个功能,如果用户输入的`是一个有效的电子邮件或URL地址,不必使用更多的js 或服务器端的代码来检查,你可以直接使用正则表达式的模式属性:

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

  datalist元素

datalist元素是一个重要的新增元素,用户按键触及数据库时,结合服务器端代码自动完成输入,不需要使用jQuery插件。

<form action="" method="post">

<input list="cars" name="cars" >

<datalist id="cars">

<option value="Volvo">

<option value="BMW">

<option value="Bugatti">

<option value="Cadillac">

<option value="Chevrolet">

<option value="Chrysler">

</datalist>

<input type="submit" />

</form>


Tags:html5 讲解