网络收集的HTML 5 的一些简单知识点 ,持续更新!

原创 阁主  2018-02-05 11:34:29  阅读 3831 次 评论 0 条
摘要:

首先先介绍下什么是 HTML5?HTML5 将成为 HTML、XHTML 以及 HTML DOM 的新标准。HTML 的上一个版本诞生于 1999 年。自从那以后,Web 世界已经经历了巨变。HTML5 仍处于完善之中。然而,大部分现代浏览器已经具备了某些 HTML5 支持。HTML5 中的一些有趣的新特性:

.用于绘画的 canvas 元素

.用于媒介回放的 video 和 audio 元素

.对本地离线存储的更好的支持

.新的特殊内容元素,比如 article、footer、header、nav、section

.新的表单控件,比如 calendar、date、time、email、url、search

网络收集的HTML 5 的一些简单知识点 ,持续更新!第1张-阁主学习小站

1 :基于HTML5的移动Web应用

Canvas绘图:通过获取HTML中的Dom元素Canvas,调用其渲染上下文的Context对象,使用Js进行图形绘制。

多媒体:Video和Audio     (多媒体视频格式:Ogg  MPEG4  WebM)

本地存储:通过提供key/value方式存储数据

Web Storage:

基于HTML5的移动Web应用

Canvas绘图:通过获取HTML中的Dom元素Canvas,调用其渲染上下文的Context对象,使用Js进行图形绘制。

多媒体:Video和Audio     (多媒体视频格式:Ogg  MPEG4  WebM)

本地存储:通过提供key/value方式存储数据

Web Storage:localStorage - 没有时间限制的数据存储

sessionStorage - 针对一个 session 的数据存储,当用户关闭浏览器窗口后,数据会被删除

Web SQL Database: 通过类似关系数据库的形式存储数据(已经是个废弃的标准了)  三个核心方法  openDatabase transaction executeSql

离线应用:当支持离线应用的浏览器检测到清单文件(Manifest File),中的任何资源文件时,便会下载对应的资源文件,将它们缓存到本地

使用地理位置

移动Web框架:基于jQuery页面驱动的jQuery Mobile、基于ExtJS架构的Sencha Touch,以及能打通Web和Native两者之间通道的PhoneGap框架。有两种开发模式:基于传统Web的开发(jQuery Mobile)和基于组件式的Web开发(Sencha Touch)

localStorage - 没有时间限制的数据存储

sessionStorage - 针对一个 session 的数据存储,当                             用户关闭浏览器窗口后,数据会被删除

Web SQL Database: 通过类似关系数据库的形式存储数据(已经是个废弃的标准了)  三个核心方法  openDatabase transaction executeSql

离线应用:当支持离线应用的浏览器检测到清单文件(Manifest File),中的任何资源文件时,便会下载对应的资源文件,将它们缓存到本地

使用地理位置

移动Web框架:基于jQuery页面驱动的jQuery Mobile、基于ExtJS架构的Sencha Touch,以及能打通Web和Native两者之间通道的PhoneGap框架。有两种开发模式:基于传统Web的开发(jQuery Mobile)和基于组件式的Web开发(Sencha Touch)

2:HTML5 中的一些有趣的新特性:

  • 用于绘画的 canvas 元素

  • 用于媒介回放的 video 和 audio 元素

  • 对本地离线存储的更好的支持

  • 新的特殊内容元素,比如 article、footer、header、nav、section

  • 新的表单控件,比如 calendar、date、time、email、url、search

3:localStorage: 永久保存的数据,是域内安全的,它是基于域的,任何在该域内的所有页面,都可以访问localStorage数据。

注意的是 Firefox中使用localStorage存储的数据在Chorme浏览器是无法读取的,同样,由于localStorage数据保存在设备中,同一个应用程序在不同设备上保存的数据是不同的,比如Android的数据IOS访问不了

先来看看Storage的API :属性 length;方法:setItem、getItem、removeItem、clear 当然大家看名称也都能知道这些是什么含义,在这里就不具体赘述各自的具体写法

sessionStorage: 存储的数据周期只保存在存储它的当前窗口或者当前窗口新建的新窗口中,一旦关闭,数据就清除,它承接于Storage的接口,用法和localStorage基本一样

Storage时间监听: StorageEvent的API: key、oldValue、newValue、url、StorageArea; Storage时间可以使用addEventListener进行注册监听


本文地址:https://www.mainblog.cn/37.html
版权声明:本文为原创文章,版权归 阁主 所有,欢迎分享本文,转载请保留出处!
免责申明:有些内容源于网络,没能联系到作者。如侵犯到你的权益请告知,我们会尽快删除相关内容。

评论已关闭!