## 2020：0518 -- JQuery基础（二）

今日内容

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

一、JQuery 高级

1.动画
    
    1.三种方式显示和隐藏元素
        1.默认显示和隐藏方式
            1.show([speed,[easing],[fn])
                1.参数：
                    speed:动画的速度。
                          有三个预定义的值：("slow","normal", or "fast")
                          或表示动画时长的毫秒数值(如：1000)
                    easing:用来指定切换效果。
                          默认是"swing":动画执行时的效果：先慢再快最后又慢
                          可用参数"linear":动画匀速执行。
                    fn:在动画完成时执行的函数，每个元素执行一次。
                          

            2.hide([speed,[easing],[fn])
            2.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的遍历方式
        * jq对象.each(callback)：这里必须是jq对象
        * $.each(object, [callback])：这里的object可以是js数组对象。其他和2.1方法一样。
        * for..of:  3.0版本之后提供的方式。高版本才会用到
        
3.事件绑定
    1. jquery标准的绑定方式
        * jq对象.事件方法(回调函数)
    2. on绑定事件/off解除绑定
        * jq对象.on("事件名称", 回调函数)
        * jq对象.off("事件名称")
            如果off方法不传递任何参数，则组件上的所有事件全部解绑。
    3. 事件切换：toggle
        * jq对象.toggle(fn1, fn2)：在事件fn1和fn2之间切换。
            * 当单击jq对象对应的组件后，会执行fn1，第二次点击会执行fn2，fn1...
            * 注意: 1.9版本 .toggle() 方法删除,jQuery Migrate（迁移）插件可以恢复此功能。(jq高版本删除了此方法)
        
4.案例

5.插件：增强JQuery的功能的
    1.实现插件的方式
        jQuery.fn.extend(object)  --->具体写法： $.fn.extend(object)  具体写法
            * 增强 通过JQuery获取的对象 的功能（对象插件）      $("#id")
        jQuery.extend(object)    ---->具体写法： $.extend(object) 
            * 增强JQuery对象自身的功能（全局插件）              $/jQuery