Ajax 是一种方法, 而不是一种编程语言. 语言的话, 用 js 就足够了.
首先需要创建一个 XMLHttpRequest 对象, 这个对象的方法包括:
- abort();
- getAllResponseHeaders()
- getResponseHeader('header')
- open('method',"url");
- send(content)
- setRequestHeader("header","value")
所有这些方法中, 用的比较多的是 open 和 send.
除此之外, XMLHttpRequest 对象还有很多属性, 包括:
- onreadystatechange
- readyState
- responseText
- responseXML
- status
- statusText
在使用 XMLHttpRequest 对象之前, 需要判断一下浏览器的类型, 通过判断是否支持 ActiveX 控件, 是的话, 则是 IE 浏览器, 否的话, 直接本地实例化一个对象.
- var xmlHttp;
- function createXMLHttpRequest(){
- if(window.ActiveXObject){
- xmlHttp=new ActiveXObject('Microsoft.xmlHttp')
- }
- else if (window.XMLHttpRequest){
- xmlHttp=new XMLHttpRequest();
- }
- }
下面是一个小的展示, 关于 ajax 的异步如何实现的
- <!DOCTYPE html>
- <html xmlns="http://www.w3.org/1999/xhtmL">
- <head>
- <meta charset="UTF-8">
- <title>Ajax_01</title>
- <script type="text/javascript">
- var xmlHttp;
- function createXMLHttpRequest(){
- if(window.ActiveXObject){
- xmlHttp=new ActiveXObject('Microsoft.xmlHttp')
- }
- else if (window.XMLHttpRequest){
- xmlHttp=new XMLHttpRequest();
- }
- }
- function startRequest(){
createXMLHttpRequest();// 创建 XMLHttpRequest 对象
xmlHttp.onreadystatechange=handleStateChange;//onreadystatechange 表示每次该对象的状态变化的时候, 都会调用 handleStateChange 函数.
- xmlHttp.open('GET',"simpResponse.xml",true);// 调用 simpResponse.xml 文档,
- xmlHttp.send(null);// 不给服务器发送信息
- }
- function handleStateChange(){
- if(xmlHttp.readyState==4){//(完成) 响应内容解析完成, 可以在客户端调用了
- if(xmlHttp.status==200){//http 的状态码为 200 时, 表示正常交互完成
- alert("the server replied with:"+xmlHttp.responseText);// 弹出消息框, 调用出 xmlHttp 对象的的文档内容
- }
- }
- }
- </script>
- </head>
- <body>
- <form action="=#">
- <input type="button" value="PRESS" onclick="startRequest()">
- </form>
- </body>
- </html>
比如说, 我的目的是通过点击 button 来调用 startRequest() 函数. 那么在这个函数里面, 可以看到每一步的注释.
来源: http://www.bubuko.com/infodetail-2563874.html