html5 离线存储 worker

html5 离线存储

<!DOCTYPE html>
<html manifest="cache.manifest">       <!--manifest存储-->
<head lang="en">
    <meta charset="UTF-8">
    <title>html5 离线存储  小应用</title>
</head>
<body>
1.在服务器如,apache 的httpd.conf 添加
AddType text/cache-manifest .manifest
2.顶部添加  manifest存储
3.编辑 cache.manifest

cache.manifest(文件名)
//以下是文件内容，缓存了一张图片
CACHE MANIFEST
2.png

</body>
</html>

 html5 worker

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
html5 worker 在服务器后台创建一个线程，加快程序运行。
<script>
    var w1 = new Worker('test.js');
    w1.postMessage('hi');
    w1.onmessage = function(ev){    //  把一部分数据处理交给  html5  worker处理，
        alert( ev.data );
    };
</script>
<!--
test.js 文件 

self.onmessage = function(ev){
    self.postMessage(ev.data + '妙味课堂');   // 对数据进行处理，再返回
};

-->
</body>
</html>

 内容编辑 语言输入 桌面提醒

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
<!--内容编辑 contenteditable="true"-->
<div contenteditable="true" style="height:200px; width:200px; background:red;">aaaaaaaaaaa</div>
<!--语言输入   谷歌支持  可以录音输入   谷歌支持-->
<input type="text" x-webkit-speech />

<!--桌面提醒 谷歌支持-->
<script>
    window.webkitNotifications.requestPermission();
    statue = window.webkitNotifications.checkPermission();
    var notification =window.webkitNotifications.createNotification("[imgurl]","Title","Body");
    notification.show();
</script>
</body>
</html>

 

posted @ 2016-04-28 14:36  gyz418  阅读(222)  评论(0)    收藏  举报