jQuery动画

Posted 2020-11-20 tydy9891-

##jQuery动画

    .show()显示，括号中有三个参数，可以设置时间

    .hide()隐藏，括号中有三个参数，可以设置时间

    .toggle()原先是显示的点击后就隐藏；原先是隐藏的点击后显示

    .slideUp()从上往下显示

    .fadeIn()/fadeOut()淡入淡出

    .animate()(异步方法)里面设置的属性值必须是数字

**动画停止**

    .finish()停止当前正在运行的动画；清空队列；来到最终匹配的状态
    .stop
      (T(清空队列),T(gotoEnd))来到当前动画的最终状态

      (F,F)不会清空后面的状态 以当前点击隐藏的状态执行下一个状态

      (T,F)清空队列，停在当前状态

      (F,T)不会清空队列，会立刻来到最终状态

**jQuery性能优化**

    1.总是从ID选择器开始继承
      例：$("父选择器名 子选择器名")
    2.尽量在class前面加上元素名
      例：$("元素名加上选择器名")
    3.尽量使用ID选择器来替代类选择器
    4.在适当的时候尽量使用链式操作
    5.将jQuery对象缓存起来使用,并在变量名前面加上$
      例：let $ps=$("root p");
          for(let i=0;i<$ps.lenth;i++){
                        console.log($ps[i]);
    
                                       }
    6.限制直接操作DOM的次数
    7.尽量使用事件委托
    8.使用事件委托时应该用on或者delegate方法来替代live
    9.JS代码尽量拖迟到window.onload事件中进行
    10.能用子代选择器就不要用后代选择器