jQuery开发之Ajax
1。load()方法
(1)load()方法是jQuery中最经常使用和最简单的Ajax方法,能载入远程HTML代码,并插入代码中。
它的结构为:
load(url [,data] [,callback])
load()方法解释例如以下表所看到的
演示样例代码例如以下:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GB18030">
<title>jQuery test </title>
<script type ="text/javascript" src ="jquery.js" ></script>
<link href="styles.css" rel="stylesheet" type="text/css" />
<script type ="text/javascript">
$(document).ready(function(){
$("#send").click(function(){
$("#resText").load("test.html");
});
});
</script>
</head>
<body>
<div class ="comment">
<h6>张三:</h6>
<p class ="para">沙发</p>
</div>
<div class ="comment">
<h6>李四:</h6>
<p class ="para">板凳</p>
</div>
<div class ="comment">
<h6>王五:</h6>
<p class ="para">地板</p>
</div>
<input type ="button" id ="send" value ="Ajax获取" />
<div class ="comment">已有评论:</div>
<div id = "resText"></div>
</body>
</html>
执行效果:
没有单击button的时候
单击button后
(2) 筛选载入的html文档
核心代码例如以下:
$("resText").load("test.html .para")
执行效果例如以下:
(3)传递方式
load()方法的传递方式依据data来自己主动指定。假设没有參数传递。则採用 GET方式传递。反之,则採用POST方式。演示样例代码例如以下:
无參数传递是get方法
$("resText").load("test.php",function(){
})
$("resText").load("test.php",{name:"rain",age:"22"},function(){
})
(4) 回调參数
对于必须在载入完毕后再能进行的操作。load()方法提供了回调函数(callback),该函数有三个參数分别代表请求返回的内容,请求状态和XMLHttpRequest对象,jQuery代码例如以下:
$("resText").load("test.php",function(responseText,textStatus,XMLHttpRequest){
//responseText 返回的内容
//textStatus 请求状态 success, error, notmodified,timeout
//XMLHttpRequest对象
})
2。$.get()方法和$.post()方法
$.get()
方法使用GET方法进行异步请求。
它的结构为:
$.get(url [,data] [,callback] [,type])
參数解释例如以下:
$.post()
方法演示样例代码例如以下:
3,$.getScript()
方法 和$.getJson()
方法
(1), 有时候,在页面初次载入时取得所需的所有javaScript()文件是全然没有必要的。尽管能够在须要哪个 JavaScript的时候,动态的创建<script>
标签。jQuery代码例如以下:
$(document.createElement("script")).attr("src","test.js").appendTo("head");
或者
$("<script type ='text/javaScript' src ='test.js'/>").appendTo("head");
用$.getScript()
更加的简单
$.getScript("test.js")
(2) $.getJson()
方法
jQuery演示样例代码例如以下:
(4) $.ajax()
方法
$.ajax()
方法是jQuery中Ajax的最底层实现。结构为:
$.ajax(options)
參数说明例如以下:
演示样例代码例如以下:
$(function(){
$("send").click(function(){
$.ajax({
type:"GET",
url:"test.js",
dataType:"script"
});
});
})
jQuery中Ajax全局事件还有其它几种。例如以下:
注意:
最新文章
- python学习05——字典
- PowerDesigner执行SQL生成模型
- poj1456 结构体排序+贪心
- JDK错误
- Java开发心得
- InstallShield:自己备份
- 理解RESTful架构(转)
- 在 Sublime Text 3 中快捷打开 git-gui
- ssi服务器端指令详解(shtml)
- java获取泛型信息
- [DeeplearningAI笔记]ML strategy_2_2训练和开发/测试数据集不匹配问题
- 拦截器(Interceptor)中的invocation.invoke()
- 科学地增加postgresql最大连接数
- c#的WebService和调用
- Numbers、Strings、Lists 笔记<;一>;
- Ubuntu16下配置支持Windows访问的samba共享
- centos6编译安装mysql5.5
- response对象、转发、重定向
- 05-python基础
- Bioperl 解析blast的输出结果
热门文章
- Linux配置使用SSH Key登录并禁用root密码登录(替换同理)
- es6--之箭头函数
- PYDay10&;11&;12&;13-常用模块:time|datetime|os|sys|pickle|json|xml|shutil|logging|paramiko、configparser、字符串格式化、py自动全局变量、生成器迭代器
- APP版本升级
- 第一阶段Sprint 对其他团队评价
- 【软考5】解释型 or 编译型
- 【Go】错误处理
- ps 批量杀死进程
- BZOJ-1507 文本编辑器(Editor)
- [BZOJ4993||4990] [Usaco2017 Feb]Why Did the Cow Cross the Road II(DP + 线段树)