js ajax 常用函数

来源：互联网发布：聊天软件市场分析编辑：程序博客网时间：2024/05/21 17:02

创建对象：

var xmlhttp;if (window.XMLHttpRequest){    //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码    xmlhttp=new XMLHttpRequest();}else{    // IE6, IE5 浏览器执行代码    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}

前后交互：

http://www.runoob.com/ajax/ajax-xmlhttprequest-send.html

交互用open和send2个方法：

open：

open(method,url,async)规定请求的类型、URL 以及是否异步处理请求。method：请求的类型；GET 或 POSTurl：文件在服务器上的位置async：true（异步）或 false（同步）

send 用于发送数据：

将请求发送到服务器。string：仅用于 POST 请求

发送方式对比：

GET 还是 POST？
与 POST 相比，GET 更简单也更快，并且在大部分情况下都能用。
然而，在以下情况中，请使用 POST 请求：
无法使用缓存文件（更新服务器上的文件或数据库）
向服务器发送大量数据（POST 没有数据量限制）
发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠

发送头信息的函数

setRequestHeader(header,value)向请求添加 HTTP 头。header: 规定头的名称value: 规定头的值

ajax的异步：

AJAX 指的是异步 JavaScript 和 XML（Asynchronous JavaScript and XML）。XMLHttpRequest 对象如果要用于 AJAX 的话，其 open() 方法的 async 参数必须设置为 true：xmlhttp.open("GET","ajax_test.html",true);对于 web 开发人员来说，发送异步请求是一个巨大的进步。很多在服务器执行的任务都相当费时。AJAX 出现之前，这可能会引起应用程序挂起或停止。通过 AJAX，JavaScript 无需等待服务器的响应，而是：在等待服务器响应时执行其他脚本当响应就绪后对响应进行处理

ajax响应：

如需获得来自服务器的响应，请使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性。responseText :获得字符串responseXml:xml文件例子：document.getElementById("myDiv").innerHTML=xmlhttp.responseText;

ajax状态：

onreadystatechange 事件
当请求被发送到服务器时，我们需要执行一些基于响应的任务。
每当 readyState 改变时，就会触发 onreadystatechange 事件。
readyState 属性存有 XMLHttpRequest 的状态信息。

onreadystatechange  存储函数（或函数名），每当 readyState 属性改变时，就会调用该函数。readyState   存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。0: 请求未初始化1: 服务器连接已建立2: 请求已接收3: 请求处理中4: 请求已完成，且响应已就绪status200: "OK"404: 未找到页面

例子：

<!DOCTYPE html><html><head><meta charset="utf-8"><script>function loadXMLDoc(){    var xmlhttp;    if (window.XMLHttpRequest)    {        //  IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码        xmlhttp=new XMLHttpRequest();    }    else    {        // IE6, IE5 浏览器执行代码        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");    }    xmlhttp.onreadystatechange=function()    {        if (xmlhttp.readyState==4 && xmlhttp.status==200)        {            document.getElementById("myDiv").innerHTML=xmlhttp.responseText;        }    }    xmlhttp.open("GET","/try/ajax/ajax_info.txt",true);    xmlhttp.send();}</script></head><body><div id="myDiv"><h2>使用 AJAX 修改该文本内容</h2></div><button type="button" onclick="loadXMLDoc()">修改内容</button></body></html>

阅读全文

0 0