复习php知识点十
2016-08-09 21:54
453 查看
AJAX基础:
AJAX(Asynchronous JavaScript And XML)涉及到7项技术,其中Javascript、XMLHttpRequest、Dom、XML是最为重要
XMLHttpRequest对象
XMLHttpRequest是XMLHTTP组件的对象,通过这个对象,AJAX可以像桌面应用程序一样只同服务器进行数据交换,却不用每次都刷新界面,也不用每次将数据处理的工作都交给服务器来做;这样既可减轻服务器负担又加快了响应速度、缩短了用户等待时间。
IE5.0开始,开发人员可以在Web页面内部使用XMLHTTPActiveX组件扩展自身的功能,不用从当前Web页面导航就可以直接传输数据到服务器或者从服务器接收数据。Mozilla1.0以及NetScape7则是创建继承XML代理类XMLHttpRequest;对应大多数情况,XMLHttpRequest对象和XMLHTTP组件很相似,方法和属性类似,只是部分属性不同
XMLHttpRequest对象:
<script language=“javascript”>
var xmlHttp = false;
if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
</script>
XMLHttpRequest对象的方法:
XMLHttpRequest对象属性:
Javascript/DOM/XML:
Javascript一直被定位为客户端的脚本语言,应用最多的地方就是表单数据的校验。现在,可以通过javascript操作XMLHttpRequest,来跟数据库打交道
DOM(Document Object Model)是提供给Html和XML使用的一组API,提供了文件的表述结构,并可以利用它改变其中的内容。脚本语言通过DOM才可以跟页面进行交互。Web开发人员可操作及建立文件的属性、方法以及事件都以对象来展现。比如,document就代表页面对象本身
XML,是网上传输的数据,文档符合统一的标准。Xml可以很容易让所有程序共享
AJAX开发步骤:
初始化对象并发出XMLHttpRequest请求
var http_request;
if(window.XMLHttpRequest){
http_request = new XMLHttpRequest();
}else if(window.ActiveXObject){
http_request = new ActiveXObject(“Mircosoft.XMLHTTP”);
}
注:有些版本的Mozilla浏览器处理服务器返回的未包含XML mime-type头部信息的内容时会出错,因此,要确保返回的内容包含text/xml,需加入:
http_request.overrideMimeType(“text/xml”);
指定响应处理函数
http_request.onreadystatechange = processRequest;
当服务器返回信息时,指定客户端的处理方式。只要将相应的处理函数名称赋给XMLHttpRequest对象的onreadystatechange属性既可。
注:需要指出的是,这个函数名称不加括号,不指定参数。也可以用javascript即时定义函数的方式定义响应函数,比如:
http_request.onreadystatechange = function(){
};
发送HTTP请求
指定响应处理函数之后,就可以向服务器发送HTTP请求了。这一步调用XMLHttpRequest对象的open和send方法。
http_request.open(“GET”,http://www.example.org/index.jsp,true);
http_request.send(null);
open的第一个参数是HTTP请求的方法,GET、Post或者Head
open的第二个参数是目标URL。基于安全考虑,这个URL只能是同网域的,否则会提示“没有权限”的错误。这个URL可以是任何的URL,包括需要服务器解释执行的页面,而不仅仅是静态页面。目标URL处理XMLHttpRequest请求跟处理普通的HTTP请求一样,比如JSP可以用request.getParameter(“”)或者request.getAttribute(“”)来取得URL参数值。
open的第三个参数只是指定在等待服务器返回信息时,是否继续执行下面的代码。如果为true,则不会,直到服务器返回信息,默认为true
open调用完毕后,要调用send方法。Send的参数如果是以post方式发出的,可以是任何想传给服务器的内容。不过,跟form一样,如果要传文件或者Post内容给服务器,必须先调用setRequestHeader(“Content-Type”,”application/x-www-form-urlencoded”);
这时,资料则以查询字符串的形式列出,作为send的参数,例如:name=value&so=on
处理服务器返回的信息
在第二步,我们已经指定了响应处理函数,这一步,来看看响应处理函数都应该做什么。
首先,它要检查XMLHttpRequest对象的readyState值,判断请求目前的状态。参照前文的属性标可以指定,readyState值为4的时候,代表服务器已经传回所有的信息,可以开始处理信息并更新页面内容了。如下:
If(http_request.readyState){
//信息已经返回,可以开始处理
}else{
//信息还没有返回,等待
}
服务器返回信息后,需判断返回的HTTP状态码,确定返回的页面没有错误,所有的状态码可以在W3C的官方网站上查到。其中,200代表页面正常。
if(http_request.status==200){
//页面正常,可以开始处理
}else{
//页面有问题
}
XMLHttpRequest对成功返回的信息有两种处理方式:
responseText
将传回的信息当字符串使用
responseXML
将传回的信息当XML文档使用,需用DOM进行解析处理
<script language=“javascript”>
var http_request = false;
function send_request(url){//初始化、指定处理函数、//发送请求的函数
//初始化XMLHttpRequest对象
if(window.XMLHttpRequest){
http_request = new XMLHttpRequest();
if(http_request.overrideMimeType){
http_request.overrideMimeType(“text/xml”);
}
}else if(window.ActiveXObject){//IE
try{
http_request = new ActiveXObject(“Msxml2.XMLHTTP”);
}catch(e){
try{
http_request = new ActiveXObject(“Microsoft.XMLHTTP”);
}catch(e){
}
}
}
If(!http_request){
window.alert(“无法创建XMLHttpRequest实例”);
return false;
}
http_request.onreadystatechange = processRequest;
http_request.open(“GET”,url,true);
http_request.send(null);
}
function processRequest(){
if(http_request.readyState==4){
if(http_request.status==200){
alert(http_request.responseText);
}else{
alert(“您所请求的页面有异常”);
}
}
}
</script>
AJAX基础:
AJAX(Asynchronous JavaScript And XML)涉及到7项技术,其中Javascript、XMLHttpRequest、Dom、XML是最为重要
XMLHttpRequest对象
XMLHttpRequest是XMLHTTP组件的对象,通过这个对象,AJAX可以像桌面应用程序一样只同服务器进行数据交换,却不用每次都刷新界面,也不用每次将数据处理的工作都交给服务器来做;这样既可减轻服务器负担又加快了响应速度、缩短了用户等待时间。
IE5.0开始,开发人员可以在Web页面内部使用XMLHTTPActiveX组件扩展自身的功能,不用从当前Web页面导航就可以直接传输数据到服务器或者从服务器接收数据。Mozilla1.0以及NetScape7则是创建继承XML代理类XMLHttpRequest;对应大多数情况,XMLHttpRequest对象和XMLHTTP组件很相似,方法和属性类似,只是部分属性不同
XMLHttpRequest对象:
<script language=“javascript”>
var xmlHttp = false;
if (window.ActiveXObject) {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
}
else if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
</script>
XMLHttpRequest对象的方法:
方法 | 描述 |
Abort() | 停止当前请求 |
getAllResponseHeaders() | 作为字符串返回完整的headers |
getResponseheader(“hederLabel”) | 作为字符串返回单个的header标签 |
Open(“method”,“URL”[,asyncFlag[,”userName”[,”password”]]]) | 设置未决的请求的目标URL方法和其他参数 |
Send(content) | 发送请求 |
setRequestHeader(“label”,”value”) | 设置header并和请求一起发送 |
属性 | 描述 |
onreadystatechange | 状态改变的事件触发器 |
readyState | 对象状态(integer): 0=未初始化,1=读取中,2=已读取,3=交互中,4=完成 |
responseText | 服务器进程返回数据的文本 |
responseXML | 服务器进程返回数据的兼容DOM的XML文档对象 |
status | 服务器返回的状态码,如404=“文件未找到”、200=“成功” |
statusText | 服务器返回的状态文本信息 |
Javascript一直被定位为客户端的脚本语言,应用最多的地方就是表单数据的校验。现在,可以通过javascript操作XMLHttpRequest,来跟数据库打交道
DOM(Document Object Model)是提供给Html和XML使用的一组API,提供了文件的表述结构,并可以利用它改变其中的内容。脚本语言通过DOM才可以跟页面进行交互。Web开发人员可操作及建立文件的属性、方法以及事件都以对象来展现。比如,document就代表页面对象本身
XML,是网上传输的数据,文档符合统一的标准。Xml可以很容易让所有程序共享
AJAX开发步骤:
初始化对象并发出XMLHttpRequest请求
var http_request;
if(window.XMLHttpRequest){
http_request = new XMLHttpRequest();
}else if(window.ActiveXObject){
http_request = new ActiveXObject(“Mircosoft.XMLHTTP”);
}
注:有些版本的Mozilla浏览器处理服务器返回的未包含XML mime-type头部信息的内容时会出错,因此,要确保返回的内容包含text/xml,需加入:
http_request.overrideMimeType(“text/xml”);
指定响应处理函数
http_request.onreadystatechange = processRequest;
当服务器返回信息时,指定客户端的处理方式。只要将相应的处理函数名称赋给XMLHttpRequest对象的onreadystatechange属性既可。
注:需要指出的是,这个函数名称不加括号,不指定参数。也可以用javascript即时定义函数的方式定义响应函数,比如:
http_request.onreadystatechange = function(){
};
发送HTTP请求
指定响应处理函数之后,就可以向服务器发送HTTP请求了。这一步调用XMLHttpRequest对象的open和send方法。
http_request.open(“GET”,http://www.example.org/index.jsp,true);
http_request.send(null);
open的第一个参数是HTTP请求的方法,GET、Post或者Head
open的第二个参数是目标URL。基于安全考虑,这个URL只能是同网域的,否则会提示“没有权限”的错误。这个URL可以是任何的URL,包括需要服务器解释执行的页面,而不仅仅是静态页面。目标URL处理XMLHttpRequest请求跟处理普通的HTTP请求一样,比如JSP可以用request.getParameter(“”)或者request.getAttribute(“”)来取得URL参数值。
open的第三个参数只是指定在等待服务器返回信息时,是否继续执行下面的代码。如果为true,则不会,直到服务器返回信息,默认为true
open调用完毕后,要调用send方法。Send的参数如果是以post方式发出的,可以是任何想传给服务器的内容。不过,跟form一样,如果要传文件或者Post内容给服务器,必须先调用setRequestHeader(“Content-Type”,”application/x-www-form-urlencoded”);
这时,资料则以查询字符串的形式列出,作为send的参数,例如:name=value&so=on
处理服务器返回的信息
在第二步,我们已经指定了响应处理函数,这一步,来看看响应处理函数都应该做什么。
首先,它要检查XMLHttpRequest对象的readyState值,判断请求目前的状态。参照前文的属性标可以指定,readyState值为4的时候,代表服务器已经传回所有的信息,可以开始处理信息并更新页面内容了。如下:
If(http_request.readyState){
//信息已经返回,可以开始处理
}else{
//信息还没有返回,等待
}
服务器返回信息后,需判断返回的HTTP状态码,确定返回的页面没有错误,所有的状态码可以在W3C的官方网站上查到。其中,200代表页面正常。
if(http_request.status==200){
//页面正常,可以开始处理
}else{
//页面有问题
}
XMLHttpRequest对成功返回的信息有两种处理方式:
responseText
将传回的信息当字符串使用
responseXML
将传回的信息当XML文档使用,需用DOM进行解析处理
<script language=“javascript”>
var http_request = false;
function send_request(url){//初始化、指定处理函数、//发送请求的函数
//初始化XMLHttpRequest对象
if(window.XMLHttpRequest){
http_request = new XMLHttpRequest();
if(http_request.overrideMimeType){
http_request.overrideMimeType(“text/xml”);
}
}else if(window.ActiveXObject){//IE
try{
http_request = new ActiveXObject(“Msxml2.XMLHTTP”);
}catch(e){
try{
http_request = new ActiveXObject(“Microsoft.XMLHTTP”);
}catch(e){
}
}
}
If(!http_request){
window.alert(“无法创建XMLHttpRequest实例”);
return false;
}
http_request.onreadystatechange = processRequest;
http_request.open(“GET”,url,true);
http_request.send(null);
}
function processRequest(){
if(http_request.readyState==4){
if(http_request.status==200){
alert(http_request.responseText);
}else{
alert(“您所请求的页面有异常”);
}
}
}
</script>
相关文章推荐
- 复习php知识点一
- 复习php知识点三
- php知识点复习之字符串
- 复习php知识点四
- 复习php知识点九
- 复习php知识点八
- 复习php知识点二
- 复习php知识点七
- 复习php知识点六
- php知识点复习之正则表达式
- 复习php知识点五
- 复习php知识点十一
- 计算机网络知识点总结-2009年针对网工的复习资料
- 第一次读php知识点
- 29:ASP.NET复习系列- ADO.NET基本知识点-数据集和数据库的同步-DataAdapter
- 2011考研数学概率论基础复习必备知识点
- PHP 常用知识点
- 1:ASP.NET复习系列-ASP.NET基本知识点-ASP.NET页面框架
- 考研政治基础复习指导之马原重点知识点归纳
- 28:ASP.NET复习系列- ADO.NET基本知识点- DataSet和XML