使用语法
<audio src="song.mp3" controls="controls" loop="loop" autoplay="autoplay">亲 您的浏览器不支持html5的audio标签</audio>
属性
src  是歌曲的路径
controls  播放控制 如果给标签里写了 controls="controls" 那么网页会显示audio自带的播放控件，如果没写就不会显示.
loop 歌曲循环 在标签里添加该属性歌曲循环 如果你的歌曲是从后台调取的的 也可以在ajax里设置 loop=true/false来控制;
autoplay 当歌曲加载后自动播放，但是只有pc端可以实现 移动端不行(pc端的浏览器要比移动端的完善很多，对有些属性支持也会好很多)
以上是标签内的属性 当然也可以作为对象属性来调取控制auido.*

audio不单单是个标签 他也是window下的一个对象，对象就有属性和方法，作为对象他有哪些常用的方法呢
对象属性：
currentTime 获取当前播放时间
duration 获取歌曲的总时间
play 是否在播放 返回true/false
pause 是否暂停 返回true/false
对象方法：
play() 播放歌曲
pause() 暂停歌曲
load()重新加载歌曲

html5 audio的语法以及属性和方法的更多相关文章

  1. html5 audio标签切换播放音乐的方法

    html5 audio标签切换播放音乐的方法<pre><audio id="music1" preload loop="loop">&l ...

  2. html5音频和视频相关属性和方法

    方法 方法 描述 addTextTrack() 为音视频加入一个新的文本轨迹 canPlayType() 检查指定的音视频格式是否得到支持 load() 重新加载音视频标签 play() 播放音视频 ...

  3. javascript 简单语法 对象属性及方法

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. html5 audio音频播放全解析

    序 html5开启了一个新时代,因为它让浏览器本身变得不那么被动,audio api就是一个典型的列子,在html5还没确定之前,如果想要在网页上听音乐看视频唯一的办法就是用flash意思是当你没有给 ...

  5. HTML5 Audio/Video 标签,属性,方法,事件汇总

    HTML5 Audio/Video 标签,属性,方法,事件汇总 (转) 2011-06-28 13:16:48   <audio> 标签属性:src:音乐的URLpreload:预加载au ...

  6. HTML5 Audio/Video 标签,属性,方法,事件汇总 （转）

    HTML5 Audio/Video 标签,属性,方法,事件   <audio> 标签属性:src:音乐的URLpreload:预加载autoplay:自动播放loop:循环播放contro ...

  7. [转帖]HTML5 Audio/Video 标签,属性,方法,事件汇总

    HTML5 Audio/Video 标签,属性,方法,事件汇总 <audio>标签属性: src:音乐的URL preload:预加载 autoplay:自动播放 loop:循环播放 co ...

  8. HTML5 Audio and Video 的新属性简介

    前言:HTML5 中 Audio and Video的使用方法比较简单,但就是比较复杂,方法属性多.如果不常用的几乎难以记住,甚至有些人难以区分不同属性和方法的作用,更别说应用了.以下对Audio a ...

  9. HTML5 Audio标签方法和函数API介绍

    问说网 > 文章教程 > 网页制作 > HTML5 Audio标签方法和函数API介绍 Audio APIHTML5HTML5 Audio预加载 HTML5 Audio标签方法和函数 ...

随机推荐

  1. Nginx：轻量级高性能的Web服务器

    Nginx ("engine x") 是一个高性能的HTTP和反向代理服务器,也是一个IMAP/POP3/SMTP服务器.Nginx是由Igor Sysoev为俄罗斯访问量第二的R ...

  2. sharepont 2013 隐藏Ribbon 菜单

    引用:C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\15\ISAPI\Microsoft.Web.Comma ...

  3. T3500通过PXE克隆报“Unable to Control A20 Line XMS Driver not installed”

    问题:使用deepin_ghost1.6中的PXE网络GHOST时提示如下错误信息: ERROR:Unable to control A20 line!XMS Driver not installed ...

  4. Linux内核USB驱动【转】

    本文转载自:http://www.360doc.com/content/12/0321/14/8363527_196286673.shtml 注意,该文件是2.4的内核的驱动源文件,并不保证在2.6内 ...

  5. 【日常小记】linux中强大且常用命令：find、grep【转】

    转自:http://www.cnblogs.com/skynet/archive/2010/12/25/1916873.html 在linux下面工作,有些命令能够大大提高效率.本文就向大家介绍fin ...

  6. C# : CEF操作

    代码挺差的,仅供学习.参考 class CEFGlueLoader { class CefAppImpl : CefApp { protected override void OnBeforeComm ...

  7. JavaScript---function、this关键字相关习题

    1. 请看下列代码: function F( ){ function C( ){ return this; } return C(); } var o=new F( ); 请问上面的this值指向的是 ...

  8. 快速增加sql数据

    declare @i int begin insert into dbo.w10test(Name) select Name from dbo.w10test end;

  9. 前端之CSS（一）

    一.什么是CSS CSS是Cascading Style Sheets,层叠样式表,高大上的说法是用来控制网页数据的表现,可以使网页的表现与数据内容分离.通俗来讲,就是用各种盒子的堆叠实现我们想要的H ...

  10. PHP三元运算符 isset($_GET['id']) ? $_GET['id'] : ”

    $id = isset($_GET['id']) ? $_GET['id'] : ''; ?> 这是一个php的三元运算符 (条件) ? (值1):(值2); 解释:如果条件成立(为真),则执行 ...