xml地图|网站地图|网站标签 [设为首页] [加入收藏]

澳门皇家赌场网站:第六章 jQuery和ajax应用,第六

来源:http://www.ccidsi.com 作者:集成介绍 人气:59 发布时间:2019-11-20
摘要:第六章 jQuery和ajax应用,第六章jqueryajax ajax是异步JavaScript和xml的简称。 ajax是异步JavaScript和xml的简称。 一. ajax补白 优势 不足(不一定是不足) 不需要任何插件(但需要浏览器支持js)

第六章 jQuery和ajax应用,第六章jqueryajax

ajax是异步JavaScript和xml的简称。

ajax是异步JavaScript和xml的简称。

一. ajax补白

优势 不足(不一定是不足)
不需要任何插件(但需要浏览器支持js) XMLHttpRequest对象在不同浏览器下有差异
优秀的用户体验——不需要重复加载页面 破坏了浏览器前进后退的功能
提高了程序性能 搜索引擎不友好
把一部分负担有服务器端转移到客户端 开发难度大

ajax最重要的中央是XMLHttpRequest对象

一. ajax补白

优势 不足(不一定是不足)
不需要任何插件(但需要浏览器支持js) XMLHttpRequest对象在不同浏览器下有差异
优秀的用户体验——不需要重复加载页面 破坏了浏览器前进后退的功能
提高了程序性能 搜索引擎不友好
把一部分负担有服务器端转移到客户端 开发难度大

ajax最重大的中坚是XMLHttpRequest对象

1.XMLHttpRequest目的的天性和办法

从剖析三个ajax.js伊始

 

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 function ajax(url, fnSucc, fnFaild){     var oBtn=document.getElementById('btn1');        oBtn.onclick=function(){         var oAjax=null;         if(window.XMLHttpRequest){             oAjax=new XMLHttpRequest();         }else{             oAjax=new ActiveXObject("Microsoft.XMLHTTP");         };                    oAjax.open('GET','url',true);                    oAjax.send();            oAjax.onreadystatechange=function(){             if(oAjax.readyState==4){                    if(oAjax.status==200){                     fnSucc(oAjax.responseText);                 }else{                     if(fnFaild){                         fnFaild();                     }                                        }            }         }     } }

 

ajax函数中八个参数分别是文本文件路线、接收成功时试行的函数,选取失利时实行的函数。

 

属性/方法/事件

描述 实例 备注
1.readyState readyState标识了当前对象的状态。    
0 已创建 readyState但1未初始化    
1 已调用open()方法,准备发送    
2 已通过send()发送,但未收到响应    
3 正在接收    
4 完成响应    
2.responseText 接收到的文本内容   只有readyState值为4时,才收到完整的响应信息
3.responseXML 描述被 XMLHttpRequest解析后的XML文档属性    
4.status http状态码 oAjax.status==200表示响应正确 readyState为3或4时才能访问。
5.statusText 状态码文本   readyState为3或4时才能访问。
6.onreadystatechange(事件) 每当readyState被改变时,都会触发onreadystatechange事件    
7.open() 有5个参数 oAjax.open('GET','url',true);  
method 发送请求的方法
GET,POST,PUT,DELATE,HEAD
  要求大写
uri 指定把请求发送到对应的URI    
acynic 是否异步,默认为true   当为true时send()方法才能被调用
username和password 服务器验证访问状况    
8.send() 发送数据   没有open(),就没有send()。也就是说:readyState必须为1前提,才能调用。
9.abort() 暂停接收或发送, XMLHttpRequest对象回归初始化状态。    
10.setRequestHeader() 请求头部信息   readyState为1时才能调用
11.getResponseHeader() 检索响应的头部值   readyState为3或4是才能调用。否则得到null

测试ajax需求在地点搭建服务器。

1.XMLHttpRequest对象的性质和章程

从深入分析贰个ajax.js起始

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
function ajax(url, fnSucc, fnFaild){
    var oBtn=document.getElementById('btn1');
  
    oBtn.onclick=function(){
        var oAjax=null;
        if(window.XMLHttpRequest){
            oAjax=new XMLHttpRequest();
        }else{
            oAjax=new ActiveXObject("Microsoft.XMLHTTP");
        };
          
        oAjax.open('GET','url',true);
          
        oAjax.send();
  
        oAjax.onreadystatechange=function(){
            if(oAjax.readyState==4){