来源于传智播客老师发的笔记

今日内容:

1. JQuery 高级
1. 动画
2. 遍历
3. 事件绑定
4. 案例
5. 插件

JQuery 高级

1. 动画
1. 三种方式显示和隐藏元素
1. 默认显示和隐藏方式
1. show([speed,[easing],[fn]])
1. 参数:
1. speed:动画的速度。三个预定义的值("slow","normal", "fast")或表示动画时长的毫秒数值(如:1000)
2. easing:用来指定切换效果,默认是"swing",可用参数"linear"
* swing:动画执行时效果是 先慢,中间快,最后又慢
* linear:动画执行时速度是匀速的
3. fn:在动画完成时执行的函数,每个元素执行一次。 2. hide([speed,[easing],[fn]])
3. toggle([speed],[easing],[fn]) 2. 滑动显示和隐藏方式
1. slideDown([speed],[easing],[fn])
2. slideUp([speed,[easing],[fn]])
3. slideToggle([speed],[easing],[fn]) 3. 淡入淡出显示和隐藏方式
1. fadeIn([speed],[easing],[fn])
2. fadeOut([speed],[easing],[fn])
3. fadeToggle([speed,[easing],[fn]]) 2. 遍历
1. js的遍历方式
* for(初始化值;循环结束条件;步长)
2. jq的遍历方式
1. jq对象.each(callback)
1. 语法:
jquery对象.each(function(index,element){});
* index:就是元素在集合中的索引
* element:就是集合中的每一个元素对象 * this:集合中的每一个元素对象
2. 回调函数返回值:
* true:如果当前function返回为false,则结束循环(break)。
* false:如果当前function返回为true,则结束本次循环,继续下次循环(continue)
2. $.each(object, [callback])
3. for..of: jquery 3.0 版本之后提供的方式
for(元素对象 of 容器对象) 3. 事件绑定
1. jquery标准的绑定方式
* jq对象.事件方法(回调函数);
* 注:如果调用事件方法,不传递回调函数,则会触发浏览器默认行为。
* 表单对象.submit();//让表单提交
2. on绑定事件/off解除绑定
* jq对象.on("事件名称",回调函数)
* jq对象.off("事件名称")
* 如果off方法不传递任何参数,则将组件上的所有事件全部解绑
3. 事件切换:toggle
* jq对象.toggle(fn1,fn2...)
* 当单击jq对象对应的组件后,会执行fn1.第二次点击会执行fn2..... * 注意:1.9版本 .toggle() 方法删除,jQuery Migrate(迁移)插件可以恢复此功能。
<script src="../js/jquery-migrate-1.0.0.js" type="text/javascript" charset="utf-8"></script> 4. 案例
1. 广告显示和隐藏
[请关闭屏蔽广告的插件来看](https://www.sogeisetsugo.tk/javaweblearn/day20/day21jquery/04-jQuery%E7%BB%BC%E5%90%88%E6%A1%88%E4%BE%8B/%E5%B9%BF%E5%91%8A%E7%9A%84%E8%87%AA%E5%8A%A8%E6%98%BE%E7%A4%BA%E4%B8%8E%E9%9A%90%E8%97%8F.html)
2. 抽奖
[抽奖](https://www.sogeisetsugo.tk/javaweblearn/day20/day21jquery/04-jQuery%E7%BB%BC%E5%90%88%E6%A1%88%E4%BE%8B/%E6%8A%BD%E5%A5%96.html)
5. 插件:增强JQuery的功能
1. 实现方式:
1. $.fn.extend(object)
* 增强通过Jquery获取的对象的功能 $("#id")
2. $.extend(object)
* 增强JQeury对象自身的功能 $/jQuery

JQuery 高级的更多相关文章

  1. jquery插件开发继承了jQuery高级编程思路

    要说jQuery 最成功的地方,我认为是它的可扩展性吸引了众多开发者为其开发插件,从而建立起了一个生态系统.这好比大公司们争相做平台一样,得平台者得天下.苹果,微软,谷歌等巨头,都有各自的平台及生态圈 ...

  2. jQuery高级编程

    jquery高级编程1.jquery入门2.Javascript基础3.jQuery核心技术 3.1 jQuery脚本的结构 3.2 非侵扰事JavaScript 3.3 jQuery框架的结构 3. ...

  3. JQuery高级(一)

    JQuery 高级 1. 动画 2. 遍历 3. 事件绑定 4. 案例 5. 插件 1. 动画 1. 三种方式显示和隐藏元素 1. 默认显示和隐藏方式 1. show([speed,[easing], ...

  4. JQuery高级笔记

    ## 今日内容:     1. JQuery 高级         1. 动画         2. 遍历         3. 事件绑定         4. 案例         5. 插件 ## ...

  5. jquery高级编程学习

    jquery高级编程 第1章.jQuery入门 类型检查 对象 类型检查表达式 String typeof object === "string" Number typeof ob ...

  6. jQuery高级选择器和其等价方法

    jQuery选择器和css一样,但兼容性更好 <body> <p>p1</p> <p>p1</p> <p>p1</p> ...

  7. [jquery]高级篇--标签选择

    1>3中初始化 $(document).ready(function(){ alert("开始了"); }); $(function(){ trace("初始化方法 ...

  8. [jquery]高级篇--js绑定事件

    参考:  http://www.cnblogs.com/leejersey/p/3545372.html jQuery on()方法是官方推荐的绑定事件的一个方法.$(selector).on(eve ...

  9. [jquery]高级篇--获取div子元素

    参考: http://zhidao.baidu.com/link?url=IfeQQBn1xMLqWvwdkKbQYJ8mC6ciGi_8M1NYkm6iQ-kXBMX2f2ylN-ckzFLiynn ...

随机推荐

  1. QT QLabel内容太长时候使用省略号

    版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明.本文链接:https://blog.csdn.net/xiezhongyuan07/articl ...

  2. 实用的linux 命令(上)

    今天介绍几个我常用的Linux 命令,每个命令这里只介绍其常用参数. 对于每个Linux 命令都可以使用man + 命令名称,查看其完整使用方法. 0,man man 命令是一个非常有用的命令,当你不 ...

  3. Windows系统自带的ODBC Data Sources的配置及使用

    一直不明白ODBC是个什么东东,虽然一次次碰到,却从没用过,看Wikipedia上的描述,可以访问各种数据库.Excel.CSV等,可以剥离数据库和操作系统依赖,简直神乎其神.不过这样的描述太抽象概括 ...

  4. 数据之路 - Python爬虫 - 动态页面

    一.Ajax数据爬取 1.Ajax介绍 Ajax,全称为Asynchronous JavaScript and XML,即异步的JavaScript和XML. 它不是一门编程语言,而是利用JavaSc ...

  5. POJ1651:Multiplication Puzzle(区间dp)

    Multiplication Puzzle Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 9419 Accepted: 5850 ...

  6. 数学--数论--POJ1365——Prime Land

    Description Everybody in the Prime Land is using a prime base number system. In this system, each po ...

  7. nnIPXougCC

    13:58:31           2020-03-14 发现一本书叫做<活法> 学习ing 2020-03-14 15:22:36 太快 ,练习了一会sql语句和打字 想看一会 憨豆特 ...

  8. win10 手动安装mysql-8.0.11-winx64.zip

    0.彻底删除win10上安装的mysql(转载 : https://www.cnblogs.com/jpfss/p/6652701.html) 1.去官网下载mysql-8.0.11-winx64.z ...

  9. xml出现Exception in thread "main" java.lang.NullPointerException

    运行代码出现Exception in thread "main" java.lang.NullPointerException 可以看下这个链接:https://ask.csdn. ...

  10. dp 20190617

    A. Alternative Thinking 这个标的是dp,但是我感觉就只能算思维题,不是特别难, 你仔细想想就知道,你先求出01这样子满足条件的个数,如果要进行改变,最多只可以增加两个,也可以增 ...