html5中的音频和视频

codebase="swflash.cab#version=6,0,10,0">

您的浏览器不支持video!

var video = document.getElementById("video");

//监听错误信息

video.addEventListener("error",function(){

var error = video.error;

var code = error.code;

switch (code){

case 1 :

console.info("视频加载被终止");

break;

case 2 :

console.info("网络原因,视频加载被终止");

break;

case 3 :

console.info("解码失败");

break;

case 4 :

console.info("视频格式不支持");

break;

}

},false);

/*

* networkState:网络状态属性,

* 在加载过程中读取当前网络的状态,

* NETWORK_EMPTY(数字为 0):网络链接初始状态,

* NETWORK_IDLE(数字为1):已经选择好媒体播放格式,未建立网络链接,

* NETWORK_LOADING(数字为2):媒体加载中...,

* NETWORK_NO_SOURCE(数字为3):没有支持的编码格式

*

* */

//获取networkState属性

/**

* 此处针对网络媒体而言,播放本地视频 net===3

* @type {Number}

*/

var net = video.networkState;

if(net==0){

console.info('网络链接初始状态..');

}else if (net==1){

console.info('已经选择好媒体播放格式,未建立网络链接');

}else if (net==2){

console.info('媒体加载中...');

}else if(net==3){

console.info('没有支持的编码格式');

}

//currentSrc:为只读属性,获取播放文件的src地址,本地文件为空

var src = video.currentSrc;

console.info("对应的src为:"+src);

//buffered:属性

/**

* 返回一个对象,实现了TimeRanges接口,

* 以确认浏览器是否缓存数据。

* TimeRanges:表示一段时间范围,大多数情况下TimeRanges对象表示的时间范围是一个从0开始的范围。

*

* TimeRanges:有一个length属性,表示有多少个时间范围,大多数情况下,存在时间范围时该值为1,不存在时为0.

* 有两个方法,start(index) 和end(index),大多数情况下index设置为0即可;

*

*

* @type {TimeRanges}

*/

var buf = video.buffered;

console.info(buf.length);

/**

* readyState属性:返回当前媒体播放位置的就绪状态,有五个可能值。

* HAVE_NOTHING:(数字为0)没有获取到媒体的任何信息,当前播放位置没有可播放的数据.

* HAVE_METADATA:(数字为1)已经获取到足够的媒体数据,但是当前位置的媒体数据无效.

* HAVE_CURRENT_DATA:(数字为2):当前位置已经有数据可以播放,但是没有获取到让播放器前进的数据。(

* 没有获取到下一帧的数据或者播放已经完成)

* HAVE_FUTURE_DATA:(数字3)表示当前位置已经获取到数据,可获取到让播放器前进的数据。为视频文件时,表示当前帧和下一帧

* 数据都获取到了,当当前位置是最后一帧时表示,readyState不可能为3状态(HAVE_FUTURE_DATA)。

* HAVE_ENOUGH_DATA:(数字4)表示当前位置已经获取到数据,可获取到让播放器前进的数据,

* 浏览器以某一速度加载,保证足够的数据进行播放。

* @type {number|Number}

*/

var state = video.readyState;

console.info("readyState属性为:"+state);

/**

* seekable 和seeking属性:表示浏览器是否正在请求特定播放位置的数据.

*

* seeking属性返回boolean值,true表示正在请求,false表示停止请求。

*

* seekable属性返回一个TimeRanges对象,表示请求到的时间范围。

*

* 均为只读属性。

* @type {TimeRanges}

*/

var seekable = video.seekable;

var seeking = video.seeking;

console.info("浏览器是否正在请求特定播放位置的数据:"+seeking);

/**

*

* @type {Number}

*/

var cur = video.currentTime;

var startTime = video.startTime;//开始播放的时间,一般为0

var duration = video.duration;//媒体文件总的播放时间.

console.info(cur+","+startTime+","+duration);

//浏览器支持不一致: Firefox:0 ,undefined,NaN Chrome: 0,0,NaN

/**

*played :读取已经播放的时间段

* @type {TimeRanges}

* */

var play = video.played;

/**

* 是否为暂停状态,

* true表示暂停播放,

* false表示正在播放

* @type {boolean}

*/

var paused = video.paused;

/**

* ended属性:boolean值

* true:表示播放完毕

* false:表示正在播放

* @type {boolean}

*/

var ended= video.ended;

/**

* defaultPlaybackRate:

* 修改或者读取默认的播放速率

* playbackRate:

* 修改或者读取当前的播放速率

* @type {Number}

*/

var rate = video.defaultPlaybackRate;

var playRate =video.playbackRate;

console.info("当前媒体的播放速率:"+rate);

/**

* volume属性: 读取或者修改默认音量,从0到1.0为静音,1为最大音量.

* @type {Number|CSSStyleDeclaration.volume|*}

*/

var volume = video.volume;

volume=0.4;

/**

* muted:返回boolean值。

* true:表示静音状态

* @type {boolean}

*/

var muted = video.muted;

console

.info("当前音量:"+volume+","+muted);// 1 ,false

var video = document.getElementById("video");

function pause(){

video.pause();

console.warn("视频已经暂停");

//判断是否为暂停状态

console.info(video.paused);

}

function play(){

video.play();

console.warn("视频开始播放...");

}

播放音乐的html语言,Html5音频和视频播放示例详解相关推荐

  1. php中左移和右移,c语言左移和右移的示例详解

    逻辑移位,简单理解就是物理上按位进行的左右移动,两头用0进行补充,不关心数值的符号问题. 算术移位,同样也是物理上按位进行的左右移动,两头用0进行补充,但必须确保符号位不改变. 算术移位指令 算术移位 ...

  2. python音频转数组_python音频处理的示例详解

    准备工作: 首先,我们需要 import 几个工具包,一个是 python 标准库中的 wave 模块,用于音频处理操作,另外两个是 numpy 和 matplot,提供数据处理函数. 一:读取本地音 ...

  3. python录音详解_python音频处理的示例详解

    准备工作: 首先,我们需要 import 几个工具包,一个是 python 标准库中的 wave 模块,用于音频处理操作,另外两个是 numpy 和 matplot,提供数据处理函数. 一:读取本地音 ...

  4. C语言向右移三个字母怎么做,c语言左移和右移的示例详解

    逻辑移位,简单理解就是物理上按位进行的左右移动,两头用0进行补充,不关心数值的符号问题. 算术移位,同样也是物理上按位进行的左右移动,两头用0进行补充,但必须确保符号位不改变. 算术移位指令 算术移位 ...

  5. html5代码转换为视频,HTML5中的视频代码详解

    摘要 腾兴网为您分享:HTML5中的视频代码详解,智学网,云闪付,易推广,小红书等软件知识,以及360win10,流量魔盒,fitbit,上港商城,安卓2.3.7,全民惠,五年级下册英语单词表图片,t ...

  6. R语言tidyr包gather()函数实战详解:数据收缩、从宽表到窄表

    R语言tidyr包gather()函数实战详解:数据收缩.从宽表到窄表 目录 R语言tidyr包gather()函数实战详解:数据收缩.从宽表到窄表 收缩两列数据

  7. R语言tidyr包spread()函数实战详解:数据裂变、从窄表到宽表

    R语言tidyr包spread()函数实战详解:数据裂变.从窄表到宽表 目录 R语言tidyr包spread()函数实战详解:数据裂变.从窄表到宽表

  8. R语言tidyr包Unite()函数实战详解:多个数据列合并为一列

    R语言tidyr包Unite()函数实战详解:多个数据列合并为一列 目录 R语言tidyr包Unite()函数实战详解:多个数据列合并为一列

  9. R语言tidyr包separate()函数实战详解:一列裂变为多列

    R语言tidyr包separate()函数实战详解:一列裂变为多列 目录 R语言tidyr包separate()函数实战详解:一列裂变为多列 一列裂变为两列

最新文章

  1. 谈一谈我对AI项目落地的看法
  2. mkyaffs2image编译
  3. 正则-元字符 注意正则表达式中间不要随意加空格
  4. Android FileUtil(android文件工具类)
  5. linux7怎么安装yum,centos7下怎么安装yum
  6. 诚邀参加微软.NET俱乐部10月24日Windows 7社区发布会
  7. (组合数学笔记)拆分数各类定义及公式总结
  8. 小米9疑似入网工信部 官宣暗示发布时间
  9. 为什么很多技术都觉得前端很简单?为什么?为什么?
  10. MySQL高级知识(五)——索引分析
  11. Gartner 发布2017 年商业智能和分析平台魔力象限 Tableau 获“领先者”
  12. Manage Attachment feature
  13. 路由添加失败 参数错误_Django框架基础之路由详解 | 技术
  14. 小米游戏本2019 I7 9750H 黑苹果安装教程【OC 引导 + Big Sur11.6.1】
  15. bin文件转化为csv文件
  16. 全球地区选择,支持中英文切换。国家-省市-城市-地区
  17. 桌面文件不见了怎么恢复,用它不慌张!
  18. ArcGIS之栅格地图配准
  19. 人民币金额小写转换大写
  20. nginx中配置不输入端口(指定地址)访问项目的方法

热门文章

  1. Bailian2747 Bailian4146 数字方格【暴力】
  2. CCF NOI1153 素数环
  3. POJ1321 Bailian1321 棋盘问题【DFS】
  4. 自由度(degree of freedom)
  5. 熟悉 CMake(二)—— 以一个实例说明 CMakeLists.txt 文件的编写
  6. 机器学习基础(二十一)—— 分类与回归、生成模型与判别模型
  7. 辨异 —— 单词(同义词)的辨异
  8. utilities(C++)——错误提示
  9. python处理excel的优势-推荐一款数据处理的神级工具,完全结合了Python和Excel的优势...
  10. python软件-Python软件下载|Python最新版本v3.5.1 下载_当游网