AJAX理论知识
发布时间:2020-12-16 01:53:28 所属栏目:百科 来源:网络整理
导读:一、介绍 AJAX是基于现有的Internet标准 AJAX是基于现有的Internet标准,并且联合使用它们: XMLHttpRequest 对象 (异步的与服务器交换数据) JavaScript/DOM (信息显示/交互) CSS (给数据定义样式) XML (作为转换数据的格式) 二、Ajax的组成元素 1.XMLHttpReq
一、介绍 AJAX是基于现有的Internet标准 AJAX是基于现有的Internet标准,并且联合使用它们: XMLHttpRequest 对象 (异步的与服务器交换数据) JavaScript/DOM (信息显示/交互) CSS (给数据定义样式) XML (作为转换数据的格式) 二、Ajax的组成元素 1.XMLHttpRequest 是 AJAX 的基础,XMLHttpRequest 对象用于和服务器交换数据 创建:var xhr = new XMLHttpRequest(); 2.如需将请求发送到服务器,我们使用 XMLHttpRequest 对象的 open() 和 send() 方法: xmlhttp.open("GET","ajax_info.txt",true); xmlhttp.send(); 注意: GET 还是 POST? 与 POST 相比,GET 更简单也更快,并且在大部分情况下都能用。 然而,在以下情况中,请使用 POST 请求: 无法使用缓存文件(更新服务器上的文件或数据库) 向服务器发送大量数据(POST 没有数据量限制) 发送包含未知字符的用户输入时,POST 比 GET 更稳定也更可靠 xmlhttp.open("GET","demo_get.html?t=" + Math.random(),true);//避免取得的结果是缓存,给url加上唯一的id xmlhttp.send(); 注意: 在xmlHttp.send方法中,如果带了参数则为post,否则为get方式 注意: 异步 - True 或 False? AJAX 指的是异步 JavaScript 和 XML(Asynchronous JavaScript and XML)。 XMLHttpRequest 对象如果要用于 AJAX 的话,其 open() 方法的 async 参数必须设置为 true: xmlhttp.open("GET","ajax_test.html",true); 【四要素】 var xhr = new XMLHttpRequest(); xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("myDiv").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET",true); xmlhttp.send(); 【onreadystatechange事件】 readyState: 存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。 0: 请求未初始化 1: 服务器连接已建立 2: 请求已接收 3: 请求处理中 4: 请求已完成,且响应已就绪 status: 200: "OK" 404: 未找到页面 注意: onreadystatechange 事件被触发 5 次(0 - 4),对应着 readyState 的每个变化。 function ajaxFun(){ var xhr = new XMLHttpRequest(); xhr.onreadystatechange = function(){ if(xhr.readyState==4&&xhr.status=200){ document.getElementById().innerHTML = xhr.responseText; } } xhr.open("GET","ajax_info.jsp",true); xhr.send(); } (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |