二十五岁时我们都一样愚蠢、多愁善感,喜欢故弄玄虚,可如果不那样的话,五十岁时也就不会如此明智。
标题:JavaScript ajax 简介
AJAX 是开发者的梦想,因为你可以:
- 更新一个网页无刷新页面
- 在页面加载后从服务器请求数据
- 在页面加载后从服务器接收数据
- 在后台发送数据到服务器
每章都自己动手测试这些实例
在每一章中,您可以在线编辑示例,然后单击运行按钮查看结果。
<div id="demo"> <h1>The XMLHttpRequest Object</h1> <button type="button" onclick="loadDoc()">Change Content</button> </div> <script> function loadDoc() { var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { document.getElementById("demo").innerHTML = this.responseText; } }; xhttp.open("GET.html", "ajax_info.txt", true); xhttp.send(); } </script>
AJAX 实例说明
HTML包含了
<div>
部分和<button>
部分.
<div>
部分用于显示从服务器发来的信息.
<button>
调用一个函数 (如果它被单击).该函数请求来自web服务器的数据并显示它:
函数 loadDoc()
function loadDoc() { var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { document.getElementById("demo").innerHTML = this.responseText; } }; xhttp.open("GET", "ajax_info.txt", true); xhttp.send(); }什么是AJAX?
AJAX = Asynchronous JavaScript And XML(异步JavaScript和XML).
AJAX 不是编程语言。
AJAX 是下面两个方面的组合:
- 浏览器内建的XMLHttpRequest对象 (从web服务器请求数据)
- JavaScript 和 HTML DOM (显示或者使用数据)
AJAX 是一个误导的名字. AJAX 应用程序可能使用xml来传输数据, 但同样常见的传输数据为纯文本或JSON文本.
AJAX 允许网页异步更新的数据交换与Web服务器在后台交互. 这意味着它可以更新网页的一部分,无需重新加载整个页面.
AJAX 如何工作
1. 一个事件发生在一个网页(页面加载,点击按钮)发生 2. 由JavaScript创建一个XMLHttpRequest对象 3. XMLHttpRequest 对象发一个请求到web server 4. 服务器处理这个请求 5. 服务器发送一个响应给web页面 6. JavaScript读取响应 7. 由JavaScript完成适当的动作(像更新页面)