jQuery知识点总结（第一篇:概述）

一、什么是jquery?它的特点?

   jQuery 是一个 JavaScript 库,jQuery 极大地简化了 JavaScript 编程。

    特点：
    (1).一款轻量级的js库。
        JQuery核心js文件大小不到30KB,如果使用Min版并且在服务器端启用Gzip压缩后，大小只有18KB。，不会影响页面加载速度。与Extjs相比要轻便的多。
    (2).丰富的DOM选择器
        JQuery的选择器用起来很方便，好比要找到某个dom对象的相邻元素js可能要写好几行代码，而JQuery一行代码就搞定了，再比如要将一个表格的隔行变色，JQuery也是一行代码搞定。    
    (3).链式表达式。
        JQuery的链式操作可以把多个操作写在一行代码里，更加简洁。
    (4).事件、样式、动画支持。
        JQuery还简化了js操作css的代码，并且代码的可读性也比js要强。
    (5).Ajax操作支持。
        JQuery简化了AJAX操作，JQuery将所有的Ajax操作封装到一个函数$.ajax()里，后台只需返回一个JSON格式的字符串就能完成与前台的通信。
    (6).跨浏览器兼容。
        JQuery基本兼容了现在主流的浏览器，不用再为浏览器的兼容问题而伤透脑筋。
    (7).插件扩展开发。
        JQuery有着丰富的第三方的插件，例如：树形菜单、日期控件、图片切换插件、弹出窗口等等基本前台页面上的组件都有对应插件，并且用JQuery插件做出来的效果很炫，并且可以根据自己需要去改写和封装插件，简单实用。
    (8).链式操作方式。
        JQuery中最有特色的莫过于它的链式操作方式——即对发生在同一个JQuery对象上的一组动作，可以直接接连写无需要重复获取对象。这一特点使得JQuery的代码无比优雅。
    (9).隐式迭代。
        当用JQuery找到带有“.myClass”类的全部元素，然后隐藏他们时。无需循环遍历每一个返回的元素。相反，JQuery里的方法都被设计成自动操作的对象集合，而不是单独的对象，这使得大量的循环结构变得不再必要，从而大幅度地减少代码量。

二、jquery语法：

1.基础语法： $(selector).action()
        美元符号定义 jQuery
        选择符（selector）"查询"和"查找" HTML 元素
        jQuery 的 action() 执行对元素的操作

2.入口函数：
    (1)第一种：常用的
        $(function() {
                代码体...
        })

    (2)第二种：等价于第一种（第一种书写更简单）
        $(document).ready(function(){
                代码体...
        })

面试题：
    jQuery 入口函数与 JavaScript 入口函数的区别：
             jQuery 的入口函数是在 html 所有标签(DOM)都加载之后，就会去执行。
             JavaScript 的 window.onload 事件是等到所有内容，包括外部图片之类的文件加载完后，才会执行。

三、JavaScript和jQuery方法之间的互相转换：

   1. js 方法 转化成 jq 获取 （使用$美元符）
            /*方法一*/     /*[index]：中括号*/
                alert($(document.getElementsByClassName("box")[0]).attr("name"));     //用jquery的attr方法获取下标为0，class名为.box的name属性

   2.  jq 方法 转化成 js 获取
            /*方法一*/        /*[index]：中括号*/
                alert($(".box")[0].getAttribute("name"));        //用js的原生方法getAttribute方法获取下标为0，class名为.box的name属性
            /*方法二*/         /*get(0)方法*/
                alert($(".box").get(0).getAttribute("name"));     //用js的原生方法getAttribute方法获取下标为0，class名为.box的name属性

四、jQuery中$美元符的作用：（常见的用法）

    1.  将js方法转换成jQuery方法： $(JS的选择器)
        eg:$(document.getElementsByClassName("box")[0]).attr("name")
        注释：上述写法就是将JS获取的元素，通过$()的方式转换成jQuery的选择器，从而使用jQuery的attr()属性操作。
    2.  当传进去的参数是函数的时候，则在document对象上绑定一个ready事件监听函数，当DOM结构加载完成的时候执行：jQuery(callback)：
        eg: $(function(){  })
        //以上代码和下面的效果是一样的
        $(document).ready(function(){
                  ...//代码
         })
    3.  用所提供的html代码创建DOM元素 ： jQuery(html)|
        eg:$('

这是用jq方法创建的一个div，用appendTo将这个div动态添加到body里

').appendTo('body');
    4.  如果传入一个DOM元素或者是DOM元素的数组，则把DOM元素封装到jQuery对象中并返回。
        eg: // 传入DOM元素,
        $('li').each(function(){
            $(ele).on('click',function(){
                $(this).css('background','red');        //这里的DOM元素就是this
                 })
         })
    5. 当传进去的参数是一个jQuery对象的时候，则创建该jQuery对象的一个副本并返回。副本与传入的jQuery对象引用完全相同的元素
        eg:var  aLi=$('li');
             var  copyLi=$(aLi);         //创建一个aLi的副本
             console.log(aLi);
             console.log(copyLi);
             console.log(copyLi===aLi);