jQuery学习笔记

1. jQuery是js库
        库：相当于java的工具类，库是存放东西的， jQuery是存放js代码的地方， 放的是用js代码写的function。

2. dom对象和jquery对象
        dom对象：使用javascript的语法创建的对象叫做dom对象， 也就是js对象。
        var obj=  document.getElementById("txt1");  //obj是dom对象，也叫做js对象。
        obj.value;

        jquery对象：使用jquery语法表示的对象叫做jquery对象， 注意：jquery表示的对象都是数组。
        例如，

        var jobj =  $("#txt1");  //jobj就是使用jquery语法表示的对象，也就是jquery对象，它是一个数组，现在数组中就一个值。

        dom对象可以和jquery对象相互的转换。
                dom对象可以转为jquery ， 语法： $(dom对象)
                jquery对象也可以转为dom对象， 语法： 从数组中获取第一个对象， 第一个对象就是dom对象， 使用[0]或者get{0)。

        为什么要进行dom和jquery的转换：目的是要使用对象的方法，或者方法。
        当你的对象是dom对象时，可以使用dom对象的属性或者方法，如果你想要使用jquery提供的函数，必须是jquery对象才可以。

 3.选择器： 就是一个字符串， 用来定位dom对象。定位了dom对象，就可以通过jquery的函数操作dom。
        常用的选择器：
                1）id选择器，语法：$("#dom对象的id值")
                通过dom对象的id定位dom对象。通过id找对象，id在当前页面中是唯一值。

                2）class选择器，语法：$(".class样式名)
                class表示css中的样式，使用样式的名称定位dom对象。
                3）标签选择器，语法：$("标签名称")
                使用标签名称定位dom对象。

4. 表单选择器
        使用<input>标签的type属性值，定位dom对象的方式。
        语法：$(":type属性值")
        例如：$(":text")，选择的是所有的单行文本框，
                   $(":button")，选择的是所有的按钮。

5.过滤器：在定位了dom对象后，根据一些条件筛选dom对象。
        过滤器是一个字符串，用来筛选dom对象。
        过滤器不能单独使用，必须和选择器一起使用。

                1）$("选择器:first")：第一个dom对象
                2）$("选择器:last")：数组中的最后一个dom对象
                3）$("选择器:eq(数组的下标)")：获取指定下标的dom对象
                4）$("选择器:lt(下标)")：获取小于下标的所有dom对象
                5）$("选择器:gt(下标)")：获取大于下标的所有dom对象

6.表单属性过滤器：根据表单中dom对象的状态情况，定位dom对象。
        启用状态：enabled ,
        不可用状态：disabled
        选择状态：checked，例如radio、checkbox
 

7.each语法
        1）可以对数组、json、dom数组循环处理。数组、 json中的每个成员都会调用一次处理函数。

var arr = { 1, 2, 3};  //数组
var json = {"name":"lisi","age":20 };
var obj = $(":text");

        语法：$.each( 循环的内容，处理函数 ) ：表示使用jquery的each，循环数组，每个数组成员，都会执行后面的“处理函数”一次。

        $：相当于是java的一个类名。
        each：就是类中的静态方法。
        静态方法调用，可以使用：类名.方法名称

        处理函数：function(index, emelent) :
                index, element都是自定义的形参，名称自定义。
                index：循环的索引
                element：数组中的成员

        js循环数组：

for(var i=0;i<arr.length;i++){
    var item = arr[i]; //数组成员
    //操作数组成员
    shuchu( i , item);
}

function shuchu(index, emlemnt){
    输出index ，element
}

        2）循环jquery对象，jquery对象就是dom数组。
        jquery对象.each( function(index,element) {} )

8. jquery中给dom对象绑定事件
        1）$(选择器).事件名称( 事件的处理函数)
                $(选择器)：定位dom对象，dom对象可以有多个，这些dom对象都绑定事件了。
                事件名称：就是js中事件去掉on的部分，例如js中的单击事件onclick()，jquery中的事件名称，就是click，都是小写的。
                事件的处理函数：就是一个function，当事件发生时，执行这个函数的内容。例如给id是btn的按钮绑定单击事件

$("#btn").click(funtion(){
    alert("btn按钮单击了")
})

        2）on 事件绑定
        $(选择器).on( 事件名称 , 事件的处理函数)

                事件名称：就是js事件中去掉on的部分，例如js中onclick，这里就是click。
                事件的处理函数：function 定义。

                例如，<input type="button" id="btn">
                           $("#btn").on("click", function() { 处理按钮单击 } )
 
 9. 使用jquery的函数，实现ajax请求的处理。
        没有jquery之前，使用XMLHttpRequest做ajax，有4个步骤。jquery简化了ajax请求的处理。
使用三个函数可以实现ajax请求的处理。

        1）$.ajax()：jquery中实现ajax的核心函数。
        2）$.post()：使用post方式做ajax请求。
        3）$.get()：使用get方式发送ajax请求。

        $.post()和$.get()：他们在内部都是调用的 $.ajax()。
        介绍 $.ajax函数的使用，函数的参数表示请求的url、请求的方式、参数值等信息。$.ajax()参数是一个json的结构。
        例如：$.ajax(  {名称:值， 名称1:值1..... } )

        例如：

$.ajax(  {  async:true ,
    contentType:"application/json" ,
    data: {name:"lisi",age:20 },
    dataType:"json",
    error:function(){
        请求出现错误时，执行的函数
    },
    success:function( data ) {
        // data 就是responseText, 是jquery处理后的数据。
    },
    url:"bmiAjax",
    type:"get"
    })

        json结构的参数说明：

                1）async：是一个boolean类型的值，默认是true，表示是异步请求的。可以不写async这个配置项，和xmlHttp.open(get,url,true)的第三个参数是一样的意思。
                2）contentType：一个字符串，表示从浏览器发送服务器的参数的类型。可以不写。例如你想表示请求的参数是json格式的，可以写application/json。
                3）data：可以是字符串、数组、json，表示请求的参数和参数值。常用的是json格式的数据
                4）dataType: 表示期望从服务器端返回的数据格式，可选的有：xml、html、text、json。当我们使用$.ajax()发送请求时，会把dataType的值发送给服务器，那我们的servlet能够读取到dataType的值，就知道你的浏览器需要的是json或者xml的数据，那么服务器就可以返回你需要的数据格式。
                5）error：一个function，表示当请求发生错误时，执行的函数。
                        error:function() {

                                发生错误时执行 

                        }  

                6）sucess：一个function，请求成功了，从服务器端返回了数据，会执行success指定函数。之前使用XMLHttpRequest对象，当readyState==4 && status==200的时候。
                7）url：请求的地址
                8）type：请求方式，get或者post，不用区分大小写， 默认是get方式。

        主要使用的是url、data、dataType、success。