jQuery--笔记

        jQuery对象不能使用DOM对象的方法，反过来一样

        入口函数：$(document).ready(function(){ ... } );            或         $(function(){ ... })

        入口函数与JS的onload比较：

                onload：页面加载完后，还要等图片加载完

                jQuery入口函数：等完页面加载完毕就可以了

        DOM-->jQuery：$(dom);

        jQuery-->DOM：例如$("li")[0]   或   $("li).get(0)

        mouseover 与 mouseenter 区别

                mouseover：移动到目标元素或其子元素，都会触发

                mouseenter：只有移动到目标元素才会触发

        选择器：与CSS差不多

        $("li:eq(2)") 获取下标为2的li元素        $("li:gt(3)")  获取下标大于3的li元素      $("li:even")   获取下标为偶数的li元素

        $("input:not(:checked)") 获取没有被选中的input元素                                      $("div[id='div']") 获取id为div的div元素

        筛选：

        $("div").parent()   获取元素的直接父元素           parents()  获取所有祖先元素

        $("div").chidren("span")   相当于div>sapn  子代

        $("ul").find("li")    相当于ulli    后代

        $("#div").siblings()   获取id为div的元素的兄弟元素，不包括自身

        $(this).index()    这里的this是一个DOM元素，要转换成jQuery的，index()返回当前元素在所有兄弟中的索引

        隐式迭代：   ①设置的时候，都设置成相同的值    ②获取的时候，获取第一个  （所以该用for就用for，别偷懒）

        class：

        addClass("my")：在原有的基础上添加一个my类           removeClass("my")：删除类

        hasClass("my")：是否含有某个类                                  toggleClass("my")：如果有这个类就删除，没有就添加

       

        attr()  获取属性或添加属性               removeAttr()  删除属性     

        注意：如果是checked、selected、disabled  用prop()

        css()   获取或设置css样式               

        text()  获取或设置文本    相当于innerText                          html() 获取或设置元素的内容   相当于innerHTML

        val()  获取或设置value值，如果是选择类型的例如select，就是设置默认值

        width()  获取或设置宽度（innerWidth：+padding；outWidth：+padding+border；outWidth：+padding+border+margin）

        scrollTop()、scrollLeft()：获取或设置卷曲出去的距离

        返回顶部例子中的问题：因为window中没有scrollTop，所以

                $("html,body").animate( {scrollTop : 0}, 100);

        offset().left/top                   position()

        动画：

        show([speed], [callback])  显示                                hide()   隐藏

        sildeDown([speed], [callback])  滑入↓                      slidUp()   滑出↑                  slidToggle()切换

        fadeIn()   淡入（透明度1）                                       fadeOut()  淡出（透明度0）          fadeToggle()切换

        animation(json, speed, "swing"/"linear", fn)  动画

        stop()  停止当前正在执行的动画（主要解决动画队列问题）

        动态创建元素：

        var $li = $("<li><a href="#">哈哈</a></li>");

        $("div").append($li);  或 $li.appendTo($("div"));   添加到子元素的最后面

        $("div").prepend($li)     插入到子元素的最前面（成为第一个子元素）

        $("div").before($li)        该元素的前一个兄弟元素

        $("div").after($li)           该元素的后一个兄弟元素

        $("div").empty()            删除所有子元素，自己留下

        $("div").remove()          删除元素

        $("div").clone(boolean)             克隆元素      true：默认，不复制事件        false：复制事件

        事件绑定：

        bind()     delegte()     这两个方法一般不用

        on(type, [selector], fn)    如果没有selector，就是简单事件（自己绑定事件）；如果有，就是委托事件

        委托事件：<div>   <p>委托事件</p>   </div>

                以这个为例：我给div绑定一个click事件，当我点击p的时候，由于p没有绑定事件，然后事件click冒泡到div时，                                                  div将事件传给目标

        off()     移除用on绑定的事件

        事件对象：

        例如：$("div").on("click", function(e) {...});

                screenX和screenY  距离屏幕左上角

                clientX和clientY  距离页面左上角

                pageX和pageY  距离页面左上角加滚动出去的距离

                keyCode   获得按下的键    $(documnt).on("keydown", function(e){ console.log(e.keyCode))};

                stopPropagation()   阻止冒泡事件

                preventDefault()     阻止浏览器默认行为

                return false;            既阻止冒泡也阻止默认行为

 

        $.each()  遍历