JavaWeb总结（十五）

最新推荐文章于 2024-01-31 04:31:34 发布

原创最新推荐文章于 2024-01-31 04:31:34 发布 · 125 阅读

0 ·

CC 4.0 BY-SA版权

本文详细介绍了AJAX（异步JavaScript和XML）技术的工作原理及应用。包括如何利用XMLHttpRequest对象与服务器进行数据交换，实现网页的部分异步更新，以及GET与POST请求的区别等关键知识点。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

JavaWeb总结（十五）

AJAX（Asynchronous JavaScript and XML（异步的 JavaScript 和 XML））

AJAX的作用是什么？

在无需重新加载整个网页的情况下，能够更新部分网页的技术

是一种用于创建快速动态网页的技术

通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新

AJAX - 创建 XMLHttpRequest 对象

XMLHttpRequest 是 AJAX 的基础。

XMLHttpRequest对象的方法

方法	描述
Abort()	停止当前请求
getAllResponseHeaders()	作为字符串返回完整的headers
getResponseheader(“hederLabel”)	作为字符串返回单个的header标签
open(“method”,“URL”[,asyncFlag[,”userName”[,”password”]]])	设置未决的请求的目标URL方法和其他参数
send(content)	发送请求
setRequestHeader(“label”,”value”)	设置header并和请求一起发送

XMLHttpRequest对象

属性	描述
onreadystatechange	状态改变的事件触发器
readyState	对象状态(integer):0=未初始化，1=读取中，2=已读取，3=交互中，4=完成
responseText	服务器进程返回数据的文本
responseXML	服务器进程返回数据的兼容DOM的XML文档对象
status	服务器返回的状态码，如404=“文件未找到”、200=“成功”
statusText	服务器返回的状态文本信息

从网页中获取XMLHttpRequest对象（存在兼容性问题）

//创建  XMLHttpRequest
var htttRequest =null;
if(document.all){
    htttRequest = new ActiveXObject("Microsoft.XMLHTTP");
}else{
    htttRequest = new XMLHttpRequest();
}

AJAX - 向服务器发送请求

XMLHttpRequest 对象用于和服务器交换数据。

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 更稳定也更可靠

如果需要像 HTML 表单那样 POST 数据，请使用 setRequestHeader() 来添加 HTTP 头。然后在 send() 方法中规定您想发送的数据：

xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");

方法

描述

setRequestHeader(header,value)

向请求添加 HTTP 头。

header: 规定头的名称

value: 规定头的值

异步 - True 或 False？

True异步是通过 AJAX，JavaScript 无需等待服务器的响应，而是：

在等待服务器响应时执行其他脚本

当响应就绪后对响应进行处理

False同步是通过AJAX，JavaScript等待服务器的响应后再对后续响应进行处理

AJAX开发步骤

1.客户端事件发生，调用JavaScript函数编写的事件处理程序

2.在事件处理程序中创建XMLHttpRequest对象

3.配置XMLHttpRequest对象

4.XMLHttpRequest对象发送一个异步HTTP请求到服务器

5.服务器程序接收请求，处理请求，返回相应

6.XMLHttpRequest对象调用callback()函数并处理结果

7.更新HTML

posted @ 2016-10-29 23:02 dawn-tangzedong 阅读( ...) 评论( ...) 编辑收藏