Java后端笔记(8)Ajax和JQuery(二)

3.JQuery事件

$( document ).ready( function（）{ } ) ; //文档准备就绪

$( selector ).click( function（）{ } ) ; //被选元素被单击

$( selector ).dblclick( function（）{ } ) ; //被选元素被双击

$( selector ).focus( function（）{ } ) ; //被选元素获得焦点

$( selector ).mouseover( function（）{ } ) ; //被选元素获得鼠标悬停

$( selector ).hover（function1（）{ } ，function2（）{ } ） //被选元素鼠标移入、移出

$( selector ).hide( ) //隐藏元素

4.js三大事件

1）绑定事件：规则：所有的js事件去掉on就是JQuery事件

2）设置样式：css（“属性”，“值”）；

3）操作dom元素（创建和删除）：

js中：var o=document.createElement（“div”）； //创建一个div

JQuery中：var o=$("<div> </div>"); //创建一个div

$("body").append(o); //在body里添加一个div

5.JQuery对象和js对象的区别

使用JQuery选择器定位的元素对象是JQuery对象不是js对象

两种对象都有自己的API属性，不能混用

6.两种对象是否可以转化？怎样转化？

js对象转化为JQuery对象：$(js对象)

JQuery对象转化为js对象：$(“选择器”）[0] 或者 $(“选择器 ”).get(0)

(JQuery 对象本身是一个集合，所以JQuery转js对象时要用索引下标的形式)

eg.

$("#btn").on("click,function({

var obj=$(this) ;

7.JQuery动画效果

可选的 speed 参数规定隐藏、显示的速度，取值slow、fast 或 毫秒数

可选的 callback 参数是隐藏或显示完成后所执行的函数名称

1）隐藏、显示和切换

$(selector).hide(speed,callback);

$(selector).show(speed,callback);

$(selector).toggle(speed,callback);

2）淡入、淡出和切换

$(selector).fadeIn(speed,callback);

$(selector).fadeOut(speed,callback);

$(selector).fadeToggle(speed,callback);

3）向下滑动、向上滑动和切换

$(selector).slideDown(speed,callback);

$(selector).slideUp(speed,callback);

$(selector).slideToggle(speed,callback);

8.AJAX（Asynchronous JavaScript And XML）

ajax：是一种异步的无刷新技术，局部刷新的技术（异步JavaScript和XML）

ajax实现方式：

1)JQuery实现ajax:

a. $.get("url",{id:"tg"},function( {

if(用户已注册）{

alert（“已被注册过”）；

}else{

}

}，“json”）

b. $.post("url",{传递的参数},function（）{

}，‘返回的数据格式类型[可以有]’）

c. $.getJSON("url",{ },function( ){

});

2)

$.ajax(

url:"",

data:{

属性名1：属性值1，

属性名2：属性值2，

},

dataType："json",

type:'get',

success:fucntion(data){

},

error:fucntion(data){

},

async:true

});