AJAX学习笔记(一)

AJAX是在不重新加载整个页面的基础上,与服务器交换数据和更新部分页面。

AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML)。


XMLHttpRequest是AJAX的基础,所有现代浏览器都支持。

XMLHttpReuqest是负责在后台与服务器进行数据交互的,这意味着可以在不重新加载整个页面的情况下,实现更新网页中某部分的内容的功能。


创建XMLHttpRequest对象的方法:

1、现代浏览器:variable  = new XMLHttpRequest();

2、在IE5、IE6的浏览器中使用ActiveX对象:variable = new ActiveXObject("Microsoft.XMLHTTP);


为了应对所有浏览器,一般在网页加载的时候判断:

扫描二维码关注公众号,回复: 1677134 查看本文章

var xmlhttp;

if(window.XMLHttpRequest){

xmlhttp = new XMLHttpRequest();

}else{

xmlhttp = new ActiveXObject("Microsoft XMLHTTP");

}


向服务器发送请求,可以用XMLHttpRequest的open()和send()方法:

open(method,url,async);

规定请求的类型,url以及是否异步处理请求。

method:请求的方法,可以使用GET或者POST

url:文件在服务器上的位置

async:true(异步)和false(同步)


send(string);

向服务器发送请求数据,string只能用于POST请求。


GET和POST方法的比较

GET比POST快,也更稳定,更安全。

但在下列情况中只能用POST:

1、无法使用缓存文件(更新服务器上的文件或数据库)

2、向服务器发送大量数据(POST没有数据量的限制)

3、发送包含未知数据的用户输入时,POST比GET更安全可靠


GET数据请求示例:

xmlhttp.open("GET","demo_get.asp?t=" + Math.random(),true);

xmlhttp.send();

有的服务器有缓存,如果请求一个已经访问过的url,他并不会请求信的数据,而是返回缓存中的数据,所以这个时候加入?t= Math.random()这样的一个随机数,会让服务器认为这是一个从来没有访问过的网页,从而返回一个新的请求数据。

或者使用POST请求也能解决缓存的问题。


POST数据请求示例:

xmlhttp.open("POST","demo_post.asp",true);

xmlhttp.send();


如果需要向Html那样POST数据,可以使用setRequestHeader()来添加http头,然后使用send()方法来设置规定你希望发送的数据。

setRequestHeader(heade,value);

向请求添加HTTP的头,heade规定头的名称,value规定头的值。

xmlhttp.open("POST","demo_post.asp",true);

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

xmlhtp.send("fname = biller&lname= gets");


猜你喜欢

转载自blog.csdn.net/qq_21026377/article/details/53043584