Java基本概念-jQuery

一 jQuery的实现
 
 1 使用JavaScript查询需要的HTML元素
 
 2 处理JavaScript事件
 
 3 使JavaScript可以兼容主流览器
 
 4 jQuery使用步骤：
 
  （1）引入jQuery：<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
 
  （2）写jQuery代码，写在script中，方法写在$()中
 
二 jQuery的核心方法
 
 1 查找元素
 
 2 创建元素
 
  （1）调用appendTo可以将创建的元素追加在指定元素中
 
 3 将DOM元素包装为jQuery对象
 
  （1）DOM对象只能调用JavaScript的方法
 
  （2）jQuery对象可以调用jQuery的方法
 
  （3）DOM对象和JQuery对象之间可以相互转换，方法如下：
 
    1）DOM对象：window.onload = function(){
            var a3 = document.getElementById("xxx");  }
 
    2）jQuery对象：$(document).ready(function(){
               var a1 = $('#xxx');
               var a2 = $('#xxx')[0];});
 
      DOM对象a3等价于jQuery对象的a2
 
 4 替代onload方法
 
三 jQuery对象的常用方法
 
显示效果类操作
 
 1 show和hide方法可以显示隐藏元素，可以使用toggle方法代替show和hide，toggle会根据当前元素的状态进行显示或隐藏
 
  （1） $(document).ready(function(){
     $('p').click(function(){
         $('#adv').hide();
    });
     $('#content').click(function(){
         $('#adv').show();
    });
});
 
  （2）$(document).ready(function(){
    $('p').click(function(){
        $('#adv').toggle();
    });
});
 
（1）种写法等价于（2）种写法
 
文档处理类操作
 
 1 append和appendTo的区别（两者功能相同）：
 
  （1）append是给容器里面添加内容： $('div').append('<p>append添加的内容</p>');
 
  （2）appendTo是先添加元素：$('<p>appendTo添加的内容</p>').appendTo('div');
 
 2 append、before、after、html、appendTo可以解析html文档，text不能解析html文档，直接输出内容，html替换原来元素中所有的文本内容，除了appendTo添加的内容
 
 3 empty和remove
 
  （1）empty：清空是将元素里面的内容清空
 
  （2）remove：移除是移除整个元素
 
 4 after和before
 
  （1）after：选中元素之前进行操作
 
  （2）before：选中元素之后进行操作
 
四 其他
 
 1 position：fixed 解决浮动广告问题
 
 2 jQuery中多个样式的写法：$(.a1,.a2,.a3)
 
 3 addClass：增加类样式；removeClass：移除类样式
 
 4 绑定事件：bind可以用on替换（1.7后不用bind） 

 5 jQuery的属性操作：设置输入域的值：val（）表示选中或设置被选元素的值，未设置参数时，则返回被选元素的当前值

一 load（）方法：
 
 1 用于载入远程的HTML代码并插入到DOM中
 
 2 语法：$.load(url,[data],[callback]);
 
  （1）url：请求html页的url地址
 
  （2）data：发送至服务器的数据
 
  （3）callback：请求完成时的回调函数，即服务器发送到客户端的数据。
 
二 get（）方法：
 
 1 通过http get请求从服务器上请求数据
 
 2 语法：$.get(url,data,callback)
 
  （1）url:请求HTML页的url地址
 
  （2）data：发送至服务器的key/value值
 
  （3）callback（data（从服务器响应的数据），status（服务器请求响应的状态（success和error两种状态）））：请求完成时的回调函数
 
三 post()方法
 
 1 post()方法通过HTTP POST请求从服务器上请求数据
 
 2  语法 $.post(URL,data,callback)
 
  （1）url(String)：请求的HTML页的URL地址
 
  （2）data(Map)：发送至服务器的key/value数据
 
  （3）callback(Callback)：请求完成时的回调函数
 
四 ajax（）方法：
 
 1 $.ajax是JQuery的底层AJAX实现，返回其创建的XMLHttpRequest对象，如果指定了dataType选项，请确保返回正确的MIME信息。
 
 2 $.ajax只有一个参数，参数key/value对象，包含各配置及回调函数信息
 
 3 $.ajax的详细参数
 
  （1）type:请求方式：post或get
 
  （2）data：发送到服务器的数据
 
  （3）url：发送请求的地址
 
  （4）async:为true时异步请求，为false时为同步请求，默认为true
 
  （5）success：请求成功后回调函数
 
  （6）error:请求失败时将调用此方法
 
  （7）dataType：预期服务器返回的数据类型
 
五 注!
 
 1 post请求传参，后台不用解析字符串，直接根据参数名称获取字符串
 
 2 服务端返回的是json字符串，要将其转换成json对象（JSON.parse（data））