JQuery总结

Jquery的概念 

    Jquery是prototype之后的,又一个优秀的javascript框架.

Jquery的优势

   
Jquery最核心的理念是Write less,Do more,写最少的代码,做最多的事.这让我一下就想到Jquery中的each,给一个Jquery对象注册上事件,然后通过each方法循环它的子元素,这样每个子元素也都会执行注册上的事件.

   Jquery是轻量级的js库,它兼容CSS3,还兼容各种浏览器（IE6.0+, FF1.5+, Safari 2.0+,
Opera 9.0+）.在JQuery 2.0中，将移除对老IE版本（IE 6/7/8）的支持，如果开发者比较在意老版本IE用户，只能使用JQuery1.9及之前的版本了.

    Jquery能够使用户的html页面保持代码和html内容分离，也就是说，不用再在html里面插入一堆js来调用命令了，只需定义id即可,和css类似.

    Jquery使用户能更方便地处理HTML documents、events、实现动画效果，并且方便地为网站提供AJAX交互。

    Jquery还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择。

Jquery的详细介绍

   Jquery中最常使用的基础方法是.ready方法,这个方法在页面装载完时,执行.

$(document).ready(function(){
//code
});
//简写
$(function(){
//code
});

     load方法,对应标准javascript中的onload事件,可用用来加载指定的页面,可全页面装载,也可部分加载.

    

   change方法,同理,onchange事件,当内容发生变化时,可执行该方法.

   resize方法,onresize事件,可以注册当浏览器大小发生变化时需要执行的操作.

  

   对于鼠标键盘,事件较多.其中这几个比较常用.click,鼠标单击;keyup,松开键盘,还有keydown和keypress;mouseover和mouseout可以处理鼠标进入和离开的事件.

    scroll方法,对应onscroll事件,处理滚动条滚动.scrollLeft,scrollTop方法可以获取浏览器滚动条的左边界和上边界的值.

动态效果

    以上方法的参数,除了animate,都可以是数字,以毫秒为单位;或者是"slow","normal"和"fast"3个值.这些方法基本都用来隐藏和显示某个Jquery对象.

   

     show(),hide()显示和隐藏元素,没有参数的时候,效果分别和display:block;,display:none;一样.它靠不断的改变元素的高和宽,来实现效果.

     这个使用的时候需要判断,if元素是隐藏的,那么就显示;否则,就隐藏.用起来还算是麻烦,根据理念write less,do more.可以采用toggle()方法来显示,隐藏元素,无需判断.

    slideUp()和sildeDown(),实现向上和向下卷动的效果.没有参数的时候,效果和他们的参数为normal一样.它靠改变元素的高,来实现效果.

    同理,slideToggle()方法,显示向上或向下卷动的效果,无需判断.

    

    fadeIn()和fadeOut(),实现淡入,淡出的效果.

    

    同理,也有fadeToggle(),实现淡入淡出,无需判断.

    最后的动画效果,animate是很强大的,它可以实现任意的动画效果,可以控制某个css属性在某个时间内进行变化,从而达到动画的效果.另一种说法,animate()方法执行css属性集的自定义动画,该方法通过css样式将元素从一个状态变化为另一个状态.css属性值是逐渐改变的,这样就可以创建动画效果.

遍历函数

    is方法,根据选择器检查当前匹配元素集合，如果存在至少一个匹配元素，则返回 true。如$target.is("li")

     

    each方法,相当于each in,循环遍历.eq,each方法注册function的时候,会有一个index索引值的参数.而eq可以根据索引值index得到Jquery对象多个元素中的一个元素.

    由于Jquery几乎所有的操作都是先使用根据CSS选择器查找DOM对象,然后对其进行各种操作.所以查找各种节点是很有必要的.找父节点使用parent(),上一个兄弟节点使用prev(),图上写错了不是previous(),是prev().下一个兄弟节点用next(),子节点是children(),这个查出来可以是多个元素.也可以使用类似于$("p"),查出页面中所有的p标签元素.

    

    要从一堆的节点中查找到一些特定的节点,filter过滤.其中even,是查找节点中的偶数节点,odd是奇数节点.

    appendTo()方法可以将一个节点添加到另一个节点的所有子节点的后面.$("<b>Hello World!</b>").appendTo("p"); 在每个p元素的结尾插入内容,粗体的Hello World!

$()函数

    

    1.在Jquery中$()用处很广泛.在$()中的参数不同,用处也不同.如果在$()中是function(){},则$(function(){})就是$(document).ready(function(){})的简写.页面加载完成之后执行该function中的方法.

    

    2.如果参数是个css选择器,比如$("p"),$(".class"),$("#id"),可以获得页面指定的节点,并封装成Jquery对象.也是因为Jquery的大部分方法都会返回执行这个方法的Jquery对象,所以可以采用链式方法来编写Jquery代码.

   

    3.而如果是个DOM对象,就会直接转换成Jquery对象.比如

var cr=document.getElementById("cr"); //dom对象
var $cr = $(cr); //转换成jquery对象

    

    其中cr就是DOM对象,而$(cr)转换之后的$cr就是Jquery对象.一般来说,Jquery对象都是由$()函数制造出来的.而用javascript方法获取的对象是DOM对象.

    4.最后就是参数是一段正确的html,就会创建一个DOM节点,并包装成Jquery对象.比如

var option1=$("<input type='text'>");//参数html

     

             最后,是一些其他方法.

其他方法

 

    以上方法看着挺多的,实际上也就一点点,才17个,而且大部分都是见名知义,容易懂的很...至于不懂的,就留到用得时候了...

    最后,总结:Jquery总结差不多了...