基本使用

day01

等页面加载完毕再执行

常用api

显示 $(div).show()
隐藏 $(div).hide()
设置样式 $(div).css(属性名，值)
停止当前动画，直接开始下一个动画 stop(false,false)
当前的元素 $(this)
当前的元素索引 $(this).index()

     $(function() {
      $('div').hide();
    })

对象

jQuery对象只能使用jQuery的方法，通过原生获取的对象只能使用原生的方法
dom转jquery

jquery对象和dom对象转换,因为jquery对象是数组存储原生对象，所以访问数组即可 $('video')[0].paly()

jquery常用api

jquery选择器

和css一致

隐式迭代，当有多个属性同时被选中时，jquery会隐式迭代所有属性改变所有的值

自身筛选

父子兄筛选，主要用于再操作时的选取元素

上面的红色部分是prevtAll的作用,下面的部分是nextAll的作用

$("ul li").eq(2).css("color","red")

排他思想

jquery样式操作

$(this) 可以是$(this)也可以是$("div")

设置类样式方法

jquery动画效果

显示隐藏

显示$('div').show()
隐藏$("div").hide()
切换$("div").toggle()

上下拉效果

下滑动 $("div").slideDown()
上滑动,500为滑动时间为500毫秒 $("div").slideUp(500)
滑动切换 $("div").slideToggle()

事件切换

类似css里的hover，有两个参数，第一个是鼠标经过，第二个是鼠标离开

            $(".nav>li").mouseout(function() {
                $(this).children("ul").hide();
            })
            $(".nav>li").hover(function() {
              $(this).children("ul").slideDown(200)
            },function () {
              $(this).children("ul").slideUp(200)
            })

停止动画队列的问题，否则就会出现排队执行动画的问题

            $(".nav>li").hover(function () {
              $(this).children("ul").stop().slideToggle(200)
            })

淡入淡出

淡入fadeIn(100)
淡出 fadeOut(100)
淡入淡出切换 fadeToggle(100)
透明度逐渐变化

//1000为speed，0.5为opacity
$("div").fadeTo(1000,0.5)

重学jQuery系列