码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript之ajax

时间:2016-05-08 16:33:23      阅读:199      评论:0      收藏:0      [点我收藏+]

标签:

ajax可以异步加载,在不刷新整个网页的情况下和服务端交互信息并更新页面的一个部分。主要有两种请求方式:get和post。

由于ie6以上才支持XMLHttpRequest所以在声明对象的时候最好如下这种方式声明:
if(window.XMLHttpRequest){ var xhr = new XMLHttpRequest(); }else{ var xhr = new ActiveXObject(‘Microsoft.XMLHTTP‘); }
创建对象之后连接服务器:
xhr.open(‘GET‘,‘服务端代码的地址?keyword=c&user_name=mike&age=20‘,true);

然后发送请求:
xhr.send();

然后接受返回值:
xhr.onreadystatechange=function(){
    if(xhr.readyState==4){
        if(xhr.status==200){
            alert(xhr.responseText);
        }else{
            alert("failed")
        }
    }
};

如果用set方法那么就是上面的写法,将传递的参数放在url里面,多个参数之间用 & 连接。
如果是post方法:
xhr.open("POST","ajax.php",true);
            xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
            xhr.send("key1=x&key2=q&key3=w");
            xhr.onreadystatechange=function(){
                if(xhr.readyState==4&&xhr.status==200){
                    alert(xhr.responseText);
                }
            }

上面服务端的代码在ajax.php里面,用post方法需要添加setRequestHeader方法,里面的写法就是上面所示。要传递的参数放在send方法里面。

 

get方法:速度快,传递的数据大小只有4kb,适用于小数据量的传递,传递的参数会暴露在url里面。

post方法:容量几乎无限,大多数情况下用于上传数据。

 

JavaScript之ajax

标签:

原文地址:http://www.cnblogs.com/huizit1/p/5470685.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!