音频视频播放(jquery中将jquery方法转化成js方法)

在jQuery中没有音频视频直接播放的方法,我们在写音频视频时,应该将jquery的方法转化为js方法:play();pause()

补充:

  将jq对象转化成js对象写法:

var music=$("#music")[0];//将jq转化为js对象;

将js对象转化成jq对象:

这个对象已经存在,则只需要在此对象上加上$(),也即是$(对象)
 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>Title</title>
 6     <script src="js/jquery-3.1.0.min.js"></script>
 7     <script>
 8         $(function(){
 9            $("#play").on("click",function(){
10                var music=$("#music")[0];//将jq转化为js对象
11                if ($(this).html()=="暂停"){//如果加入的为暂停。 music.pause();同时显示为 $(this).html("播放")
12                    music.pause();
13                    $(this).html("播放")
14
15                }else {//否则music.play();同时显示为 $(this).html("暂停")
16                    music.play();
17                    $(this).html("暂停")
18                }
19            } )
20         })
21     </script>
22 </head>
23 <body>
24 <div id="play">暂停</div>
25 <audio src="music/m2.mp3" autoplay id="music"></audio>
26 </body>
27 </html>
时间: 2025-01-24 04:39:45

音频视频播放(jquery中将jquery方法转化成js方法)的相关文章

HTML DOM对象的属性和方法介绍(原生JS方法)

HTML DOM对象的属性和方法介绍 DOM 是 Document Object Model(文档对象模型)的缩写. DOM(文档对象模型)是针对HTML和XML文档的一个API(应用程序编程接口),它允许程序和脚本动态地访问和更新文档的内容,结构和样式. W3C DOM 标准被分为 3 个不同的部分: 核心 DOM - 针对任何结构化文档的标准模型 XML DOM - 针对 XML 文档的标准模型 HTML DOM - 针对 HTML 文档的标准模型 HTML DOM 定义了所有 HTML 元

C# 调用、执行 js 方法

首先需要引用程序集 Microsoft Script Control 1.0 然后新建一个js文件,并写入相应的js方法 //执行JS文件 private void btnjs_Click(object sender, EventArgs e) { //读取js文件路径 string path = AppDomain.CurrentDomain.BaseDirectory + "JavaScript1.js"; //加载js文件的所有内容 保存到变量str2中 string str2

JS调用App方法及App调用JS方法

做App内嵌H5项目时,经常会遇到js与App的交互,最普遍的就是方法的互相调用,那么如何实现方法的互相调用呢? 写在前面: 如果只是小项目且后期扩大的可能性不大的时候,可以忽略,可如果是长期项目的话,那么就需要考虑以下一些问题了. 1. 方法命名规范. 如果考虑到以后会有大量的方法,那么规范化的命名就很重要了,规范化的命名,既保证了名字的唯一性又保证了代码的可读性方便开发过程,也方便后期维护.   举个栗子,  如果现在有一个方法,是关闭webview, js调用app的方法, 如果直接叫cl

jquery ajax跨域的完美解决方法(jsonp方式)

ajax跨域请求的问题,JQuery对于Ajax的跨域请求有两类解决方案,不过都是只支持get方式,接下来为大家详细介绍下客户端JQuery.ajax的调用代码 今天在项目中需要做远程数据加载并渲染页面,直到开发阶段才意识到ajax跨域请求的问题,隐约记得Jquery有提过一个ajax跨域请求的解决方式,于是即刻翻出Jquery的API出来研究,发 JQuery对于Ajax的跨域请求有两类解决方案,不过都是只支持get方式.分别是JQuery的 jquery.ajax jsonp格式和jquer

jquery得到iframe src属性值的方法

这篇文章主要介绍了jquery得到iframe src属性值的方法,很简单,很实用,需要的朋友可以参考下 取得iframe src属性的的值: Html代码 <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>jquery</title>

基于jquery的has()方法以及与find()方法以及filter()方法的区别详解

1. has(selector选择器或DOM元素)   将匹配元素集合根据选择器或DOM元素为条件,检索该条件在每个元素的后代中是否存在,将符合条件的的元素构成新的结果集. 例子如下:<ul>  <li>list item 1</li>  <li>list item 2    <ul>      <li><div><span>a</span></div>list item 2-a<

Jquery中each的三种遍历方法

Jquery中each的三种遍历方法 $.post("urladdr", { "data" : "data" }, function(data) { $.each(data, function(n,value) { });}); 1.选择器+遍历 $('div').each(function (i){ i就是索引值 this 表示获取遍历每一个dom对象 }); 2.选择器+遍历 $('div').each(function (index,dom

jQuery中绑定事件的几种方法

以click事件为例,jQuery中绑定事件有三种方法: (1)target.click(function(){}); (2)target.bind("click",function(){}); (3)target.live("click",function(){}); 第一种方法很好理解,其实就和普通JS的用法差不多,只是少了一个on而已 第二.三种方法都是绑定事件,但是二者又有很大的不同,下面着重讲解一下,因为这个如果用到Jquery的框架的话是用的挺多的,尤其

jQuery源码中的Ajax--get()/post()方法

load()方法通常用来在web服务器上获取静态的数据文件,如果需要传递一些参数给服务器中的页面,那就可以使用$.get()方法或$.post()方法. *$.get()方法和$.post()方法是jQuery中的全局函数 一.$.get()方法 $.get()方法是使用GET方式来进行异步请求.结构为: $.get(url [.data] [.callback] [.type]) 参数解释如下: 参数名称 类型 说明 url String 请求的HTML页的url地址 data(可选) Obj