该文介绍了JQuery的几种基本动画效果，包括淡入淡出、下拉上拉，以及如何使用slideToggle实现自动切换。同时，讲解了本地存储的LocalStorage和会话存储SessionStorage的使用，包括设置、获取和删除数据的方法。最后，文章详细阐述了如何利用JQuery的Ajax函数进行异步请求，包括定义请求URL、方法、数据类型和处理响应的回调函数。
Jquery之ajax
JQuery动画效果
一、动画效果
1.淡出
格式：$(selector).fadeout(“时间”)，默认是500ms
2.淡入
格式：$(selector).fadein(“时间”)，默认是500ms
3.下拉
格式：$(selector).slideDown(“时间”)，默认是500ms
4.上拉
格式：$(selector).slideUp(“时间”)，默认是500ms
5.自动上下拉
格式：$(selector).fadeout(“时间”)，默认是500ms
案例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
div {
background-color: red;
width: 100px;
height: 100px;
display: none;
}
.test {
display: none;
}
</style>
<script src="../static/js/jquery.min.js"></script>
</head>
<body>
<button id="Btn">点我</button>
<div></div>
</body>
<script>
$("#Btn").click(function () {
// $("div").toggleClass("test");
//$("div").fadeOut();//淡出
// $("div").fadeIn();
// $("div").slideDown();//下拉
// $("div").slideUp();//上拉
$("div").slideToggle();//自动上下拉
})
</script>
</html>
二、信息存储
本地存储（LocalStorage）
本地存储（LocalStorage）是一种永久性存储，将服务器传过来的信息保存在本地中，及时浏览器关闭也不会清除。会一直保留着。
<script>
//设置存储（键值对的形式）
localStorage.setItem("name","zhuangwanwan");
localStorage.setItem("sex","男");
//获取存储信息（用键来获取）
localStorage.getItem("name");//获取到“zhuangwanwan”
//删除存储
//1.删除指定存储（用键来删）
localStorage.removeItem("name");
//2.删除所有存储
localStorage.clear();
</script>
会话层存储（SessionStorage）
和本地存储类似，但是关闭浏览器时，存储的信息就会被删除。
三、使用JQ进行Ajax请求
<script>
$.ajax({
//请求服务器的路径
url:"传入请求的路径",
//请求方式
method:"传出请求方法（POST/GET）",
//允许服务器返回来的数据类型
dataType:"json",
data:{
//data数据
}
//成功
success:function(res){
//成功收到服务器传来的消息时的代码块
}
//失败
error:function(res){
//没有收到服务器传来的消息时的代码块
}
})
</script>
1512
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
