AJAX - 向服务器发送请求
·Previous Page
·Next Page
XMLHttpRequest 对象用于和服务器交换数据。
向服务器发送请求
如需将请求发送到服务器,我们使用 XMLHttpRequest 对象的 open() 和 send() 方法:
xmlhttp.open("GET","test1.txt",true);
xmlhttp.send();
方法
|
描述
|
open(method,url,async)
|
规定请求的类型、URL 以及是否异步处理请求。
· method:请求的类型;GET 或 POST
· url:文件在服务器上的位置
· async:true(异步)或 false(同步)
|
send(string)
|
将请求发送到服务器。
· string:仅用于 POST 请求
|
GET 还是 POST?
与 POST 相比,GET 更简单也更快,并且在大部分情况下都能用。
然而,在以下情况中,请使用 POST 请求:
·无法使用缓存文件(更新服务器上的文件或数据库)
·向服务器发送大量数据(POST 没有数据量限制)
·发送包含未知字符的用户输入时,POST 比 GET 更稳定也更可靠
GET 请求
一个简单的 GET 请求:
xmlhttp.open("GET","demo_get.asp",true);
xmlhttp.send();
亲自试一试
在上面的例子中,您可能得到的是缓存的结果。
为了避免这种情况,请向 URL 添加一个唯一的 ID:
xmlhttp.open("GET","demo_get.asp?t="+ Math.random(),true);
xmlhttp.send();
亲自试一试
如果您希望通过 GET 方法发送信息,请向 URL 添加信息:
xmlhttp.open("GET","demo_get2.asp?fname=Bill&lname=Gates",true);
xmlhttp.send();
亲自试一试
POST 请求
一个简单 POST 请求:
xmlhttp.open("POST","demo_post.asp",true);
xmlhttp.send();
亲自试一试
如果需要像 HTML 表单那样 POST 数据,请使用 setRequestHeader()来添加 HTTP 头。然后在 send() 方法中规定您希望发送的数据:
xmlhttp.open("POST","ajax_test.asp",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send("fname=Bill&lname=Gates");
亲自试一试
方法
|
描述
|
setRequestHeader(header,value)
|
向请求添加 HTTP 头。
· header: 规定头的名称
· value: 规定头的值
|
url - 服务器上的文件
open() 方法的 url 参数是服务器上文件的地址:
xmlhttp.open("GET","ajax_test.asp",true);
该文件可以是任何类型的文件,比如 .txt 和 .xml,或者服务器脚本文件,比如 .asp 和 .php (在传回响应之前,能够在服务器上执行任务)。
异步 - True 或 False?
AJAX 指的是异步 JavaScript 和 XML(Asynchronous JavaScript and XML)。
XMLHttpRequest 对象如果要用于 AJAX 的话,其 open() 方法的 async 参数必须设置为 true:
xmlhttp.open("GET","ajax_test.asp",true);
对于 web 开发人员来说,发送异步请求是一个巨大的进步。很多在服务器执行的任务都相当费时。AJAX 出现之前,这可能会引起应用程序挂起或停止。
通过 AJAX,JavaScript 无需等待服务器的响应,而是:
·在等待服务器响应时执行其他脚本
·当响应就绪后对响应进行处理
Async = true
当使用 async=true 时,请规定在响应处于onreadystatechange 事件中的就绪状态时执行的函数:
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 &&xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","test1.txt",true);
xmlhttp.send();
亲自试一试
您将在稍后的章节学习更多有关 onreadystatechange 的内容。
Async = false
如需使用 async=false,请将 open() 方法中的第三个参数改为 false:
xmlhttp.open("GET","test1.txt",false);
我们不推荐使用 async=false,但是对于一些小型的请求,也是可以的。
请记住,JavaScript 会等到服务器响应就绪才继续执行。如果服务器繁忙或缓慢,应用程序会挂起或停止。
注释:当您使用 async=false 时,请不要编写onreadystatechange 函数 - 把代码放到 send() 语句后面即可:
xmlhttp.open("GET","test1.txt",false);
xmlhttp.send();
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
亲自试一试
来自:http://www.w3school.com.cn
分享到:
相关推荐
WEB开发 之 AJAX - 向服务器发送请求.docx
Ajax如何发送请求? 原文章: https://blog.csdn.net/weixin_52203618/article/details/131324686 Ajax 是 Asynchronous Javascript And XML 的缩写,它是异步的 Javascript 和 XML技术,是由 Javascript 、 XML 、...
4. AJAX - 向服务器请求 要想把请求发送到服务器,我们就需要使用 open() 方法和 send() 方法 5. AJAX实例 AJAX可以用来创建更多交互式的网络应用程序。 6. AJAX源代码 简要分析上一章节效果的代码原理 7. AJAX与...
send(content) :向服务器发送请求 属性: onreadystatechange :状态回调函数 responseText/responseXML :服务器的响应字符串 status:服务器返回的HTTP状态码 statusText: 服务器返回的HTTP状态信息 ...
4. AJAX - 向服务器请求 要想把请求发送到服务器,我们就需要使用 open() 方法和 send() 方法 5. AJAX实例 AJAX可以用来创建更多交互式的网络应用程序。 6. AJAX源代码 简要分析上一章节效果的代码原理 ...
4. AJAX - 向服务器请求 要想把请求发送到服务器,我们就需要使用 open() 方法和 send() 方法 5. AJAX实例 AJAX可以用来创建更多交互式的网络应用程序。 6. AJAX源代码 简要分析上一章节效果的代码原理 7. ...
ajax直接jsp里写js发送服务器的请求.pdf
Ajax程序定期向服务器发送请求,获取内存使用的实时数据,并在用户界面上动态更新,这样管理员就可以不断地监测内存的变化,及时发现潜在的性能问题。此外,这个文件包还可能包含一些额外的功能,如内存使用的历史...
nodejs-ws-ajax-rest Nodejs-ws-ajax-rest 项目工作流程: 1- 客户端使用用户名注册(保存在 session.cookies 中) 2- 客户端连接到服务器 3- 客户端选择他将如何继续使用 websockets 或 ajax 请求连接到服务器 4- ...
创建本地服务器,包含简易JSON链,用ajax发送get,post请求以查找本地服务器中的JSON链
利用免费的API(飞信)给手机免费发短信的小程序,防垃圾短信可设置每日发送次数,服务器和本地双重校验,还可以设置站长发送密码,可以无限制发送!
这是通过向服务器发送异步请求并获取服务器内存使用情况的数据来实现的。然后,这些数据被用来更新用户界面,以便用户可以实时看到服务器内存的使用情况。该程序的主要优点是它可以提供实时的反馈,使用户能够更好地...
偶尔使用Ajax的开发人员也会注意到Ajax中的x并意识到它代表XML。XML是编程中最常用的数据格式之一,对于异步应用程序中的服务器响应能够带来切实的好处。在本系列前面的文章中,我们使用普通文本和名/值参数发送数据...
一:iframe + 服务器推技术comet(反向ajax,即服务器向浏览器推送数据) 二:ajax持久连接 + 长轮询 客服端采用第一种方式:iframe + 服务器推技术 思路: 1:新建comentbyiframe.php 该用文件使用while(true)一直连接...
使用了onsubmit事件,在onsubmit事件中首先获取准备post的内容,然后创建XMLHttpRequest对象,接着确定请求参数,然后重写回调函数,在函数中主要是根据请求的状态来使用服务器端返回值,然后发送请求,最后返回fals
url (String) : (默认: 当前页地址) 发送请求的地址。 示例 加载并执行一个 JS 文件。 jQuery 代码: $.ajax({ type: "GET", url: "test.js", dataType: "script" }); -------------------------------------...
数据是使用AJAX向易语言程序请求交互取到的。虽然wke浏览器也可以交互数据,但个人感觉还是Ajax顺手。像做Web应用系统一样做易语言程序,是一种什么样的feel? 用html写窗口UI,然后用Ajax交互数据。把web应用搬到...
1、XmlHttpRequest对象的open方法允许程序员用一个ajax调用向服务器发送请求。 2、method表示请求类型。最常用的有get和post请求。如果不向服务器端发送数据,只是请求服务器端的数据,这个时候可以用get方法。...
* 同步:提交请求->等待服务器处理->处理完毕返回 这个期间客户端浏览器不能干任何事 * 异步: 请求通过事件触发->服务器处理(这时浏览器仍然可以作其他事情)->处理完毕 同步是指:发送方发出数据后,等接收方发...
Ajax 作用: ...发送请求:xhr.send(); 获取服务器端给客户端的响应数据: xhr.onreadystatechange = function( //0:open()没有被调用//1:open()正在被调用 //2:send()正在被调用//3:服务端正在返回