• 因为音频格式有版权,各浏览器使用不同的音频格式。

  • 音频格式兼容性

音频格式 Chrome Firefox IE9 Opera Safari
MP3 支持 不支持 支持 不支持 支持
OGG 支持 支持 支持 支持 不支持
WAV 不支持 支持 不支持 支持 不支持

一般提供ogg和mp3格式,就可以支持所有主流浏览器了。

  • 音频格式比较:
    wav格式音质最好,但是文件体积较大。
    mp3压缩率较高,普及率高,音质相比wav要差。
    ogg与mp3在相同位速率(Bit Rate)编码的情况下,ogg体积更小,并且ogg是免费的不用交专利费(这点国人很中意)。

  • 获取音频时长兼容

  • 问题: H5 Audio标签的MP3播放长度duration,返回值为NaN?
    解决:因为还没加载完音频,所以duration会返回NaN。

  • 当音频/视频处于加载过程中时,会依次发生以下事件:
    loadstart
    durationchange
    loadedmetadata
    loadeddata
    progress
    canplay
    canplaythrough

h5 的 audio 标签知识点的更多相关文章

  1. H5之audio标签放音兼容所有浏览器方法

    前端交流群,群文件提供大量文档.书籍和资料.期待你的加入!群号:127768464 由于项目需要,最近刚做了一个网页放音的功能,使用到了H5新标签<audio></audio> ...

  2. 微信h5页面audio标签在ios下不能自动播放

    背景介绍:在一个h5页面中,当用户提交表单到后台,后台返回的结果成功的话,开始自动播放背景音乐 出现的问题:在安卓手机上正常,iOS中没有反应 后来网上一番搜索后了解到时因为iOS不允许自动播放音乐, ...

  3. H5页面实现一个Audio标签加载多个音频文件,并进行播放和展示音频长度

    最近微信项目中有需求,要将微信端发送过来的amr格式的语音文件,在项目中的页面上进行展示和播放,实现方式如下: 1.首先java后台收到微信端的消息推送的时候,使用 ffmpeg将amr格式的音频文件 ...

  4. H5 audio标签

    37-audio标签 注意点: audio标签的使用和video标签的使用基本一样, video中能够使用的属性在audio标签中大部分都能够使用, 并且功能都一样 只不过有3个属性不能用, heig ...

  5. html5 audio标签相关知识点总结

    1.audio指JS原生对象,假如用jquery获取到audio标签后,需要dom[0]转为原生JS对象 if(audio.paused){ //如果音频暂停,就播放 audio.play(); }e ...

  6. <video>和<audio>标签,对视频和音频的支持

    H5新增了<video>和<audio>标签,提供对视频和音频的支持 <audio>的属性与<video>属性相同 <video> vide ...

  7. html5 -----audio标签

    在现在的公司上班需要做一个html5页面,上下可以滑动的,在页面上需要音乐,默认开始音乐播放,点击音乐标签后音乐停止.后来在项目开发中,遇到性能优化的问题,所以我建议大家以后在使用时不要直接在页面中使 ...

  8. 用<audio>标签打造一个属于自己的HTML5音乐播放器

    上一章节,我们刚刚讲了<video>标签,今晚,我们讲的是<audio>标签,这两个东东除了表示的内容不一样以外,其他的特性相似的地方真的太多了,属性和用法几乎一样,也就说,如 ...

  9. HTML5的Audio标签打造WEB音频播放器

    目前,WEB页面上没有标准的方式来播放音频文件,大多数的音频文件是使用插件来播放,而众多浏览器都使用了不同的插件.而HTML5的到来,给我们提供了一个标准的方式来播放WEB中的音频文件,用户不再为浏览 ...

随机推荐

  1. POJ-3744 Scout YYF I (矩阵优化概率DP)

    题目大意:有n颗地雷分布在一条直线上,有个人的起始位置在1,他每次前进1步的概率为p,前进两步的概率为1-p,问他不碰到地雷的概率. 题目分析:定义状态dp(i)表示到了dp(i)的概率,则状态转移方 ...

  2. Xshell如何设置,当连接断开时保留Session,保留原文字

    Xshell [1]  是一个强大的安全终端模拟软件,它支持SSH1, SSH2, 以及Microsoft Windows 平台的TELNET 协议.Xshell 通过互联网到远程主机的安全连接以及它 ...

  3. 在EO中获取某字段基于表的列名

    //生成EO的时候自动生成的字段 public static final int BRIEFINTRO = 88; String[][] str = null; str = new String[][ ...

  4. 简话Angular 05 Angular表单验证

    一句话: 可以使用所有html5表单验证功能,同时Angular还增强了部分验证,支持动态验证 1. 上源码 <div ng-controller="ExampleController ...

  5. mysql禁止远程访问的解决办法

      1. 改表法. 可能是你的帐号不允许从远程登陆,只能在localhost.这个时候只要在localhost的那台电脑,登入mysql后,更改 "mysql" 数据库里的 &qu ...

  6. memory prefix twi,tri,trans ,tetra out 4

    1● twi 二   2● tri 三   3● trans 超过,超载   4● tetra 立体  

  7. Visual C++ 使用纪要

    1.取消在查找中标记的蓝色小方块 Ctrl+Shift+F2 取消所有标记 2.出现LINK错误 : fatal error LNK1168: cannot open Debug/x.exe for ...

  8. Python3 文件操作(十六)

    一 文件操作 1.介绍 计算机系统分为:计算机硬件,操作系统,应用程序三部分. 我们用python或其他语言编写的应用程序若想要把数据永久保存下来,必须要保存于硬盘中,这就涉及到应用程序要操作硬件,众 ...

  9. windows 自动copy远程服务器文件

    net use h: \\123.45.67.000\T1dbbackup 123456/user:administrator ------远程服务器IP123.45.67.000  .T1dbbac ...

  10. Alpha版本展示

    一.团队成员的简介和个人博客地址,团队的源码仓库地址. 1.团队的源码仓库地址 我们主要通过码云来管理代码,码云地址:https://gitee.com/ljl36/team_programming ...