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全局事件还有其它几种。例如以下:



注意:

jQuery开发之Ajax的更多相关文章

  1. Python开发之AJAX

    一.概述 对于WEB应用程序:用户浏览器发送请求,服务器接收并处理请求,然后返回结果,往往返回就是字符串(HTML),浏览器将字符串(HTML)渲染并显示浏览器上. 1.传统的Web应用:一个简单操作 ...

  2. Python开发之AJAX全套

    概述 对于WEB应用程序:用户浏览器发送请求,服务器接收并处理请求,然后返回结果,往往返回就是字符串(HTML),浏览器将字符串(HTML)渲染并显示浏览器上. 1.传统的Web应用 一个简单操作需要 ...

  3. JQuery开发之Galleriffic图片插件介绍

    Galleriffic是一个用于创建快速展示相册中照片的jQuery插件.从图一中可以看成,图片既可以以幻灯片的方式查看,也可以手动点击缩略图查看.Galleriffic还支持分页,从而使得它能够展示 ...

  4. python自动开发之(ajax)第二十天

    1.Django请求的生命周期 路由系统 -> 试图函数(获取模板+数据=>渲染) -> 字符串返回给用户 2.路由系统 /index/ -> 函数或类.as_view() / ...

  5. Django开发之Ajax POST提交403报错

    问题现象 Django开发时,前端post提交数据时,由于csrf机制,如果不做处理会报403报错 问题解决 通过在data字段中添加 csrfmiddlewaretoken: '{{ csrf_to ...

  6. Django开发之Ajax 返回内容报错

    预期效果 Django通过Ajax POST提交数据,前台弹窗处理结果 粗略代码 # views.py 代码 ...省略... msg = { 'code': 200, 'message': 'Hel ...

  7. 转Python开发之AJAX全套

    转自:https://www.cnblogs.com/nulige/p/6603415.html#4206261

  8. JavaEE开发之SpringMVC中的自定义消息转换器与文件上传

    上篇博客我们详细的聊了<JavaEE开发之SpringMVC中的静态资源映射及服务器推送技术>,本篇博客依然是JavaEE开发中的内容,我们就来聊一下SpringMVC中的自定义消息转发器 ...

  9. Liferay7 BPM门户开发之37: Liferay7下的OSGi Hook集成开发

    hook开发是Liferay客制扩展的一种方式,比插件灵活,即可以扩展liferay门户,也能对原有特性进行更改,Liferay有许多内置的服务,比如用hook甚至可以覆盖Liferay服务. 可作为 ...

随机推荐

  1. 前端用户体验优化: JS & CSS 各类效果代码段

    前言 不定时更新 在线预览 https://zzyper.github.io/opti... 在线预览的源码 https://github.com/zzyper/opt... 部分内容仅兼容webki ...

  2. 【http】【转发】HTTP访问控制(CORS)

    当一个资源从与该资源本身所在的服务器不同的域或端口请求一个资源时,资源会发起一个跨域 HTTP 请求.   比如,站点 http://domain-a.com 的某 HTML 页面通过 <img ...

  3. AtCoder Beginner Contest 098 D - Xor Sum 2

    D - Xor Sum 2 Time limit : 2sec / Memory limit : 1024MB Score : 500 points Problem Statement There i ...

  4. Hi3519V101 Uboot和Kernel编译

    前面已经搭建好了Ubuntu下的海思开发环境,现在对编译Uboot和Kernel的过程做一个简单的记录.参考文档<Hi3519V101 U-boot 移植应用开发指南.pdf>和<H ...

  5. 163 AJAX

    // 163 AJAX Tab // update 2006.10.18 // 增加鼠标延迟感应特性. // update 2006.10.8 // A 标签 href 属性将保持原有HTML功能.增 ...

  6. java 位向量

    public class BitVectory { private int count; private int[] a; private static final int BIT_LEN = 32; ...

  7. Python 对Mysql的操作

    Mysql链接不同的数据库 如果python的模板是按照mysql来写的,后面数据库更换为了Oracle,难道需要重现再来写,当然不是,python提供了API接口,只要编写是面对api,后面的链接会 ...

  8. java中传入一个数或字符串或数组进行反转

    //将一个数用递归反转--利用余数 public static void inverse(int n) { System.out.print(n % 10); if (n >= 10) inve ...

  9. LINQ-进行数据转换

    一.将多个输入联接到一个输出序列中 可以使用 LINQ 查询创建包含元素的输出序列,这些元素来自多个输入序列. 以下示例演示如何组合两个内存中数据结构,但相同的原则可应用于组合来自 XML 或 SQL ...

  10. BZOJ 1813 [Cqoi2017]小Q的棋盘 ——树形DP

    唔,貌似以前做过这样差不多的题目. 用$f(i,0/1)$表示从某一点出发,只能走子树的情况下回到根.不回到根的最多经过不同的点数. 然后就可以DP辣 #include <map> #in ...