jQuery类库——基础

使用JavaScript框架或工具类库，能简化通用操作，隐藏浏览器之间的差异。jQuery足够小巧和稳定，能让你在文档中轻松找到关心的元素，并对这些元素进行操作。

jQuery()函数有4中不同的调用方式：

• 传递CSS选择器（字符串）给$()方法。
• 传递一个Element、Document或Window对象给$()方法，$()只需简单的将该对象封装成jQuery对象并返回。这样就可以使用jQuery方法来操作这些元素而不使用原生DOM方法。
• 传递HTML文本字符串给$()方法，jQuery会根据传入的文本创建好HTML元素并封装为jQuery对象返回。例如：

var img=$("<img/>",               //新建一个<img>元素
          { src:url,              //具有HTML属性
            css:{borderWidth:5},  //CSS样式
            click:handleClick     //和时间处理程序
           });

• 传入一个函数给$()方法。当文档加载完毕且DOM可操作时，传入的函数将被调用。

  jQuery(function(){ //文档加载完毕时调用
         //所有jQuery代码放在这里
     });

  有时还可以看到$(f)的老式和完整写法：

  $(document).ready(f)

  通过$()注册的函数将在DOMContentLoaded事件触发时由jQuery触发。当浏览器不支持该事件时，会在load事件触发时由jQuery触发。这意味着文档已经解析完毕，但图片等外部资源可能还未加载。如果在DOM准备就绪后再传递函数给$()，传递的函数会在$()返回之前立刻调用。

“jQuery函数”：jQuery或$()的值，可用来创建jQuery对象、注册DOM就绪时需要调用的处理程序、用作jQuery命名空间。

“jQuery对象”：由jQuery函数返回的对象。一个jQuery对象表示一组文档元素。

jQuery方法和jQuery函数：

$.each(a,f) //jQuery的each函数
$("a").each(f) //调用jQuery函数获得表示所有<a>元素的jQuery对象，调用该jQuery对象的each方法。

$()的返回值是一个jQuery对象，jQuery对象是一个类数组。

$("body").length  //=>1，文档只有唯一一个bodyy元素
$("body")[0]   //等于document.body

jQuery对象有 size()方法替代length属性， get()方法替代方括号索引、 toArray()方法转化为真实数组。jQuery对象还有三个有趣的属性：

var bodyscripts=$("script",document.body);
bodyscripts.selector  //=>"script"
bodyscripts.context   //=>document.body
bodyscripts.jquery    //=>"1.4.2"

jQuery的each()方法对jQuery对象中的每一个元素调用回调函数，this关键字指代Element对象，索引值和该元素作为第一第二参数，this和第二参数都是原生文档元素，而不是jQuery对象。jQuery的each()方法和ECMAScript5(ES5)的forEach()数组方法有一个显著区别：如果回调函数在任一元素上返回false，遍历将在该元素后终止。each()返回调用自身的jQuery对象，因此可用于链式调用。

jQuery的map()方法接收回调函数作为参数，并为jQuery对象中每一个元素都调用回调函数，同时将返回值收集起来，封装为一个jQuery对象返回。

jQuery的index()方法接受一个元素作为参数，返回值是该元素在此jQuery对象中的索引值，找不到则返回-1。如果传递的是一个jQuery对象作为参数，会对该对象的第一个元素进行搜索；如果传递字符串，会当成CSS选择器；如果什么参数都不传入，返回此jQuery对象中第一个毗邻元素的索引值。

jQuery的is()方法接收一个选择器作为参数，如果选中元素中至少有一个匹配该选择器时，返回true。