关于ajax小知识

AJAX = 异步的 JavaScript 和 XML

AJAX是基于现有的Internet标准,并且联合使用它们:

1.XMLHttpRequest 对象 (异步的与服务器交换数据);

2.JavaScript/DOM (信息显示/交互);

3.CSS (给数据定义样式)

4.XML (作为转换数据的格式)

关于AJAX的使用:

1.创建XMLHttpRequest对象

var xmlhttp;

if (window.XMLHttpRequest){

 // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码

 xmlhttp=new XMLHttpRequest();

}else

{ // IE6, IE5 浏览器执行代码 

 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");

}


2.向服务器发送请求

xmlhttp.open("GET","ajax_info.txt",true); 

 //有两种get跟post方式,

get:字符提交 安全性不高 处理时间快;

post:  字节提交  安全性比get高  处理时间慢  文件传输都用post;

xmlhttp.send();


3.服务器响应

xmlhttpre.onreadystatechange = function () {

                if(xmlhttpre.readyState == 4 && xmlhttpre.status == 200){

                    //请求成功

                    var date2 = new Date();

                    console.log(xmlhttpre.responseText);

                    console.log("date2:"+(date2.getTime()-date1.getTime()));

                }

            }


4.onreadystatechange 事件:

当请求被发送到服务器时,我们需要执行一些基于响应的任务。

每当 readyState 改变时,就会触发 onreadystatechange 事件。

readyState 属性存有 XMLHttpRequest 的状态信息。

xmlhttpobjt.onreadystatechange = function () {

//                if(xmlhttpobjt.status == 200 && xmlhttpobjt.readyState == 4){

//                    //请求完成

//                  alert(xmlhttpobjt.responseText) ;

//                }

                if(xmlhttpobjt.readyState == 2){

                    alert("2:"+xmlhttpobjt.responseText) ;

                }

                if(xmlhttpobjt.readyState == 3){

                    alert("3:"+xmlhttpobjt.responseText) ;

                }

                if(xmlhttpobjt.readyState == 4){

                    alert("4:"+xmlhttpobjt.responseText) ;

                }

            }


一个简单的登陆操作:

逻辑思维分为以下几个步骤:

1.在body中定义登录框、密码框、提交框;


你可能感兴趣的:(关于ajax小知识)