H5小内容(六)
Web Worker
基本内容
单线程与多线程
Worker可以模拟多线程的效果
定义 - 运行在后台的javascript
注意 - 不能使用DOM
在Worker中只能使用javascript中的ECMA
目前主流浏览器都支持Worker,除IE8之前
Worker提供API
检测当前浏览器是否支持Worker
if( typeof(Worker) !== "undefined" ){
说明当前浏览器支持Web Worker
}else{
说明当前浏览器不支持Web Worker
}
创建WebWorker对象
new Worker(worker文件)
Worker对象
onmessage事件
postMessage()方法
terminate()方法
Web存储API
基本内容
数据仓库 - 用于存储数据
HTML5存储系统
localStorage(本地存储) - 替代Cookie
sessionStorage(会话存储) - 替代Session(类似于内存)
sessionStorage
setItem(key,value)方法
作用 - 设置数据(新增|修改数据)
新增数据 - key值是新的
修改数据 - key值是存在的
参数
key - 作为存储数据的标识(唯一,不可重复)
value - 存储的数据内容(number|string)
getItem(key)方法
作用 - 获取数据(读取数据)
参数
key - 根据key获取对应的数据内容
返回值 - key对应的value值
key(index)方法
作用 - 根据索引值返回对应key
参数
index - 索引值
返回值 - 返回key值
removeItem(key)方法
作用 - 删除数据
参数
key - 根据key删除指定数据内容
clear()方法
作用 - 将存储系统的所有数据删除(清空)
length属性
作用 - 返回当前存储系统的数据个数
localStorage
提供的属性和方法与sessionStorage一致
storage事件
作用 - 实现多个窗口之间共享数据内容
问题
数据安全性低
目前除Safari浏览器支持该事件,其他所有浏览器都不支持
对于数据的操作
新增 - setItem()
查询 - getItem()
length属性
key(index)
删除 - removeItem()
clear()
修改
key(index) - key
getItem() - value
setItem(key,新value)
sessionStorage与localStorage
sessionStorage存储系统存储数据的特点
当浏览器窗口关闭时,数据全部丢失
当再次打开浏览器窗口时,数据不能使用
localStorage存储系统存储数据的特点
当浏览器窗口关闭时,数据依旧存储
当再次打开浏览器窗口时,数据继续使用
数据只能由用户删除
Web Socket(了解)
基本内容
socket - 是一种网络协议
网络协议 - SERVER&HTTP课程中的HTTP
WebSocket
表示在HTML5页面中允许支持socket协议
浏览器-服务器
使用的网络协议 - http协议
http协议的问题
短连接
无状态
WebSocket提供的API
创建WebSocket对象
var socket = new WebSocket(URL);
URL - 是以"ws://"开始的
创建Socket对象,建立连接
WebSocket对象的方法
send() - 向服务器端发送数据内容
close() - 关闭socket链接
WebSocket对象的事件
onmessage事件 - 当服务器端向客户端发送返回数据时被触发
onopen事件 - 当客户端与服务器端建立连接时被触发
完成初始化功能
onclose事件 - 当客户端与服务器端关闭链接时被触发
完成资源释放功能
WebSocket对象的属性
readyState属性 - 表示服务器端的通信状态
CONNECTING(数字值为0),表示正在连接。
OPEN(数字值为1),表示已建立连接。
CLOSING(数字值为2),表示正在关闭连接。
CLOSED(数字值为2),表示已关闭连接。
H5小内容(六)的更多相关文章
- H5小内容(四)
SVG 基本内容 SVG并不属于HTML5专有内容 HTML5提供有关SVG原生的内容 在HTML5出现之前,就有SVG内容 SVG,简单来说就是矢量图 ...
- H5小内容(一)
HTML5目前最新的规范(标准)是2014年10月推出 2005年左右出现HTML5版本(非标准) W3C组织(两个组织定义H5规范) 学习(研究)HTML5是学习未来(将来主流) ...
- H5小内容(五)
Geolocation(地理定位) 基本内容 地理定位 - 地球的经度和纬度的相交点 实现地理定位的方式 GPS - 美国的,依靠卫星定位 北斗定位 - 纯 ...
- H5小内容(三)
Canvas(画布) 基本内容 简单来说,HTML5提供的新元素<canvas> Canvas在HTML页面提供画布的功能 在画布中绘制各种图形 C ...
- H5小内容(二)
音视频处理 视频处理 基本内容 使用Flash技术处理HTML页面中的视频内容 包含音频.动画.网页游戏等 特点 浏览器原生不支持(IE浏览器要求安装A ...
- Egret白鹭H5小游戏开发入门(一)
前言: 好久没更新博客了,以前很多都不会,所以常常写博客总结,倒是现在有点点经验了就懒了.在过去的几个月里,在canvas游戏框架方面,撸过了CreateJS,玩得了Egret,又学过PIXI.js. ...
- 开发H5小游戏
Egret白鹭H5小游戏开发入门(一) 前言: 好久没更新博客了,以前很多都不会,所以常常写博客总结,倒是现在有点点经验了就懒了.在过去的几个月里,在canvas游戏框架方面,撸过了CreateJ ...
- SQL开发中容易忽视的一些小地方(六)
原文:SQL开发中容易忽视的一些小地方(六) 本文主旨:条件列上的索引对数据库delete操作的影响. 事由:今天在博客园北京俱乐部MSN群中和网友讨论了关于索引对delete的影响问题,事后感觉非常 ...
- 基于uniapp自定义Navbar+Tabbar组件「兼容H5+小程序+App端Nvue」
uni-app跨端自定义navbar+tabbar组件|沉浸式导航条|仿咸鱼凸起标签栏 在跨端项目开发中,uniapp是个不错的框架.采用vue.js和小程序语法结构,使得入门开发更容易.拥有非常丰富 ...
随机推荐
- Open Dynamics Engine for Linux 安装笔记
下载 在Bitbucket上可以下载到最新的版本(截止目前为0.14版) 或者直接用wget下载 wget "https://bitbucket.org/odedevs/ode/downlo ...
- Visual C++ 2012/2013的内存溢出检測工具
在过去,每次编写C/C++程序的时候,VLD差点儿是我的标配.有了它,就能够放心地敲代码,随时发现内存溢出. VLD最高可支持到Visual Studio 2012.不知道以后会不会支持Visual ...
- [Javascript] Fetch API
fetch() does the same thing as XHR, but fetch return a promise. fetch('password.txt', { 'method': 'P ...
- The Tangled Web (Web之困)第四章 摘要
1. HTML语法: 由Tag组成层级结构,标签视为名,而值插在当中. 关键组成符:<, >, ', ", & 2. 解析模式: 文件开头<!DOCTYPE> ...
- javascript进击(一)简介
javascript是属于网络的脚本语言(javascript与java就像老婆与老婆饼,并没有关系) 页面静态效果:HTML+CSS 为页面添加动态效果:javascript JavaScript ...
- 关于Modelsim仿真速度的优化
如果在不需要波形,只需要快速知道结果的情况下,可以用优化选项.这适用于做大量case的仿真阶段.因为这一阶段多数case都是通过的,只需要快速确认即可,然后把没通过的case拿出来做全波形的仿真调试. ...
- ffmpeg之yuv2rgb_c_24_rgb
YUV2RGBFUNC(yuv2rgb_c_24_rgb, uint8_t, ) LOADCHROMA(); PUTRGB24(dst_1, py_1, ); PUTRGB24(dst_2, py_2 ...
- 关于使用json 字符串转换为字典问题
问题背景: '{"backend": "www.baidu.org", "record": {"server": &qu ...
- android实现倒计时
前言 在打开爱奇艺等app的欢迎界面的时候,右上角有一个倒计时的控件.倒计时完了以后进入主界面.现在我们来实现这个功能. 方法一 利用java的类Timer,TimerTask还有android的H ...
- angularjs + springmvc 上传和下载
jsp: <form ng-submit="uploadFile()" class="form-horizontal" enctype="mul ...