html代码

<audio  id="myaudio" src="http://ws.stream.qqmusic.qq.com/C100003R74Cn0JR4O6.m4a?fromtag=0" controls="controls">
   </audio>


<button onclick="playPause()">播放/暂停</button>
<audio id="audio1" width="420" >
<source src="example.mp4" type="audio/mp4" />
<source src="example.ogg" type="audio/ogg" />
</audio>

js代码

var myAudio = document.getElementById('audio1');
function playPause(){
if(myAudio.paused){
myAudio.play();
}else{
myAudio.pause();
}
}

Html5使用audio播放音乐的更多相关文章

  1. HTML5 ——web audio API 音乐可视化(二)

    上一篇 web audio API 音乐可视化(一)介绍了一些基本的API,以及如何简单的播放一个音频,本篇介绍一下怎么对获取到的音频进行分析,并将分析后的数据绘制成图像. 最终效果请戳这里; 完整版 ...

  2. HTML5 Video/Audio播放本地文件

    这段时间经常看到开发者在反复询问同一个问题,为什么通过设置src属性,不能播放本地的媒体文件?例如video.src=”D:\test.mp4”. 这是因为浏览器中的JavaScript不能直接直接访 ...

  3. js audio 播放音乐

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  4. HTML5 ——web audio API 音乐可视化(一)

    使用Web Audio API可以对音频进行分析和操作,最终实现一个音频可视化程序. 最终效果请戳这里; 完整版代码请戳这里,如果还看得过眼,请给一个start⭐ 一.API AudioContext ...

  5. ios vue2.0使用html5中的audio标签不能播放音乐

    我写了一个M端播放音乐的组件,使用html5的audio标签 然后我使用watch监测currentSong 在浏览器中看到audio渲染的如下: 单独访问渲染出来的audio中url可以播放音乐,为 ...

  6. html5,audio音乐播放器

    最终,做了自己原来一直想要实现的事儿.得出的结果是,有些事儿一旦開始做了,那么它就并非非常难. 如今的我,正听着自己的播放器放出的<光辉岁月>写这篇周六清晨的博文.写的不是非常好.但也请各 ...

  7. html5 audio标签微信部分苹果手机不能自动播放音乐终极解决方案

    html5 audio标签微信部分苹果手机不能自动播放音乐终极解决方案 大家都知道需要在点击时候后 播放 ps:如果点击ajax 回来播放也不行,必须点击立即播放 要背景自动播放只能采取下面方案< ...

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

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

  9. html5的audio实现高仿微信语音播放效果

    效果图 前台大体呈现效果图如下: 点击就可以播放mp3格式的录音.点击另外一个录音,当前录音停止! 思路 关于播放动画,这个很简单,我们可以用css3的逐帧动画来实现.关于逐帧动画,我之前的文章也写过 ...

随机推荐

  1. APDL获取节点和单元的结果

    目录 1. 获取节点结果 1.1 获取节点应力结果 1.2 获取节点位移结果 1.3 获取节点应变结果--总应变 1.4 获取节点应变结果--弹性应变 1.5 获取节点应变结果--塑性应变 1.6 获 ...

  2. 使用注解配置Servlet3.0

    从Servlet3.0开始支持使用注解来配置. 注解只是代替了一部分的web.xml的 配置,通常在针对单个Servlet的配置时(比如Servlet的资源名称)使用注解 web.xml:优势在于解决 ...

  3. JSONObject、 JsonObject、阿里fastJson、谷歌gson区别

    JSON:JavaScript Object Notation Java对象表示法 Java中并没有内置的 JSON 解析,需要使用第三方类库.常用的类库如下 一.Gson : 古河开发的JSON 库 ...

  4. Codeforces Round #616 (Div. 2) D

    莫队的模板 struct node{ int l,r,id; }q[maxn]; int cmp(node a,node b) { ) ? a.r < b.r : a.r > b.r); ...

  5. Update(Stage4):spark_rdd算子:第2节 RDD_action算子_分区_缓存:算子和分区

    一.reduce和reduceByKey: 二.:RDD 的算子总结 RDD 的算子大部分都会生成一些专用的 RDD map, flatMap, filter 等算子会生成 MapPartitions ...

  6. 【PAT甲级】1061 Dating (20 分)

    题意: 给出四组字符串,前两串中第一个位置相同且大小相等的大写字母(A~G)代表了周几,前两串中第二个位置相同且大小相等的大写字母或者数字(0~9,A~N)代表了几点,后两串中第一个位置相同且大小相等 ...

  7. Session服务器之Session复制!

    全部运行在Tomcat下 第一台主机:192.168.200.131  安装nginx 修改hosts文件 [root@localhost ~]# vim /etc/hosts 192.168.200 ...

  8. mvn无法下载fastdfs-client-java依赖解决办法

    1.下载fastdfs-client-java源码 https://github.com/happyfish100/fastdfs-client-java 2.修改pom.xml文件 添加打包插件 & ...

  9. AttributeError: 'Word2Vec' object has no attribute 'vocab'

    在 Gensim 1.0.0 版本后移除了 vocab,需使用 model.wv.vocab

  10. HHR计划---作业复盘-直播第三课

    一,出租车广告: 1,三个点不合格:周期太长了,大而全互联网产品,不符合MVP原则:业务关键点丢掉了:没有业务认知和成长. 2,关键假设: (1)车主有没有需求呀,画像怎么样? (2)车主收入如何,能 ...