1.网络接口
ononline：网路连接时触发
onoffline：网络断开时触发
window.addEventListener("online",function(){
alert("网络连通了")；
})；
2.全屏接口
全屏操作的主要方法和属性：
（1）requestFullScreen（）；开启全屏显示
（2）cancelFullScreen（）：退出全屏
（3）fullScreenElement（）：是否全屏状态
（4）不同浏览器需要添加不同的前缀：
chrome：webkit / firefox:moz / ie:ms / opera:o;
多种浏览器之间的兼容：
用else if进行判断
3.FileReader:读取文件内容
abort（）：中断读取
e.g即时预览：
即时：当用户选择完图片之后就立刻进行预览的处理》》》onchange
预览：通过文件读取对象的readAsDataURL()完成
<form action="">
文件：<input type ="file" name="myfile" id="myfile" onchange="getFileContent();"<br>
<input type ="submit">
</form>
<img src="" alt="">
<script>
function getFileContent(){
/*1.创建文件读取对象
var reder=new FileReader（）；
/*2.读取文件获取DataURL
2.1说明没有任何的返回值：void：但是读取文件之后，他会将读取的结果存储在文件读取对象的result中
2.2.需要传递一个参数binary large object：文件（图片或者其他可以嵌入到文档的类型）
2.3：文件存储在file表单元素的files属性中，他是一个数组
var file=document.querySelctor("#myfile").files;
reader.readAsDataURL(files[0]);
/*获取数据
FileReader提供一个完整的事件模型，用来捕获读取文件时的状态
onabort：读取文件中断片时触发
onerror：读取错误时触发
onload：文件读取成功完成时触发
onloadend：读取完成时触发，无论成功还是失败
onloadstart：开始读取时触发
onprogress：读取文件过程中持续触发
reader.onload=function(){
document.querySelector("img").src=reader.result;
}
</script>
4.拖拽接口
被拖拽元素
目标元素
5.web存储
sessionStorage：存储数据到本地，存储的容量在5mb左右
（1）这个数据本质上是存储在当前页面的内存中
（2）它的生命周期为关闭当前页面，关闭当前页面数据会自动清除
setItem（key，value）：存储数据，以键值对的方式存储
getItem（key）：获取数据，通过制定的名称key或许对应的value值
removeItem（key）：删除数据，通过指定名称key删除对应的值
clear（）：清空所有存储的内容
localStorage的使用：
（1）存储的内容大概20mb
（2）不同浏览器不能共享数据，但是在同一个浏览器的不同窗口中可以共享数据
（3）永久生效，他的数据是存储在硬盘中的，并不会随着页面或者浏览器的关闭而清除，如果想清除，必须手动清除
6.应用程序缓存
demo.appcache
new file
拓展名最好用appcache
7.多媒体接口（实现自定义播放器）
播放进度条
视频跳播
播放结束跳转
网友评论