HTML5新特性在前端开发中的应用

HTML5新特性在前端开发中的应用我们都知道HTML5又出了一些新功能，这些新功能，让其有着一定的优势，比如摆脱对平台的依赖、实时更新、跨平台、离线使用等等，那具体的HTML5新特性在前端开发中是如何应用的呢？我们一起来看下吧。1、让Web再次回归到富客户端地步，而且更加的独立，减少了对第三方插件的依赖。比如：之前的HTML4的标准中并没有对于视频、音频以及其他的富客户端技术支持的非常好，这就使得Flash和SilverLight变得异常的成功。而在HTML5新标准中原生的就支持音频、视频、画布等技术。让我们的WEB程序拥有更多富客户端表现的方式，而且让我们的WEB程序更加独立，更好的适应多种形式的客户端。2、对本地离线存储的更好的支持由于之前想在客户端保存一些数据都是由cookie完成的。但是cookie不适合大量数据的存储，因为它们由每个对服务器的请求来传递，这使得cookie速度很慢而且效率也不高。HTML5提供了两种在客户端存储数据的新方法：localStorage-没有时间限制的数据存储sessionStorage-针对一个session的数据存储在HTML5中，数据不是由每个服务器请求传递的，而是只有在请求时使用数据。它使在不影响网站性能的情况下存储大量数据成为可能。对于不同的网站，数据存储于不同的区域，并且一个网站只能访问其自身的数据。HTML5使用Java来存储和访问数据。有了本地数据库的支持，让一些简单的离线应用也成为了可能。3、新的特殊内容元素，更好的支持SEO以及方便视障人士使用现在所有的站点基本上都是Div+CSS布局，几乎所有的文章标题、内容、辅助介绍等都用Div容器来承载。搜索引擎在抓取页面内容时，因为没有明确的容器的含义只能去猜测这些标签容器承载的是文章标题还是文章内容等，HTML5新标准中直接添加了拥有具体含义的HTML标签比如：article、footer、header、nav、section4、更加智能的表单标签之前的表单标签，仅仅是简单的类型的约束，比如文本框、文本域、下拉列表等，而跟业务结合紧密的表单标签数据校验等控制都没有很好的支持，而是用这些技术都基本上都是跟第三方的JS控件进行结合使用，但是这些第三方总会涉及到版本控制、浏览器兼容性、非标准等一系列的问题，而在HTML5的标准中直接添加了智能表单，让这一切都变得那么的简单，比如calendar、date、time、email、url、search。5、HTML5即时二维绘图,也就是画布的引入，让Java子弹飞画布的引入使得：Web端生成动画效果、制作Web游戏、更好的交互体验设计都增加了无限的变数，当社区充斥着乱七八糟超炫的HTML5的JS控制的效果的时候，让人无限的赞叹。HTML5的canvas元素使用Java在网页上绘制图像。画布是一个矩形区域，您可以控制其每一像素。canvas拥有多种绘制路径、矩形、圆形、字符以及添加图像的方法。6、JS嗑药了，支持多线程在不影响UIupdate及浏览器与用户交互的情况下,前端做大规模运算，只能通过setTimeout之类的去模拟多线程。而新的标准中，JS新增的HTML5WebWorker对象原生的就支持多线程。7、WebSockets让跨域请求、长连接、数据推送等一切都变得那么简单，Web不仅仅是AjaxWebSockets是在一个(TCP)接口进行双向通信的技术，PUSH技术类型。WebSocket是html5规范新引入的功能，用于解决浏览器与后台服务器双向通讯的问题，使用WebSocket技术，后台可以随时向前端推送消息，以保证前后台状态统一，在传统的无状态HTTP协议中，这是“无法做到”的。另外谈到HTML5新特性在前端开发中是如何应用的问题，其实HTML5更重要的一点就是能更好的异常处理，HTML5(text/html)浏览器将在错误语法的处理上更加灵活。HTML5在设计时保证旧的浏览器能够安全地忽略掉新的HTML5代码。与HTML4.01相比，HTML5给出了解析的完整规则，让不同的浏览器即使在发生语法错误时也能返回完全相同的结果。还有一点就是：文件API让文件上传和操纵文件变得简单；由于项目中经常遇到用Web应用中控制操作本地文件，而之前都是使用一些富客户端技术比如flash，ActiveX，Silverlight等技术，面对文件JS就是个shit，就是个鸡肋。在HTML5的新的提供的FHTML5FileAPI让JS可以轻松上阵了。通过上述对HTML5新特性在前端开发中是如何应用的介绍，相信大家对HTML5有了更深入的了解，当然除了上述这些，HMTL5的新性能还有很多，比如编辑、拖放、微数据、浏览历史管理、地理信息接口API、设备硬件操作API等资料由AAA教育整理