异步 JavaScript 和 XML (AJAX) .ppt
- 格式:ppt
- 大小:250.50 KB
- 文档页数:33
简介本文介绍一种方法,Ajax(Asynchronous JavaScript andXML,提出:Jesse James Garrett),使用它可以构建更为动态和响应更灵敏的Web应用程序。
Ajax是2005年2月才正式提出的一项综合技术,其主要特点是为Web开发提供异步的数据传输和交换方式,可以在不重载(Reload)刷新(Refresh)界面的情况下与服务器进行数据交换。
该方法的关键在于对浏览器端的JavaScript、DHTML和与服务器异步通信的组合。
如果使用得当,这种强大的力量可以使应用程序更加自然和响应灵敏(无刷新更新局部页面),从而提升用户的浏览体验。
术语Ajax用来描述一组技术,它使浏览器可以为用户提供更为自然的浏览体验。
在Ajax之前,Web站点强制用户进入提交/等待/重新显示范例,用户的动作总是与服务器的“思考时间”同步。
Ajax提供与服务器异步通信的能力,从而使用户从请求/响应的循环中解脱出来。
借助于Ajax,可以在用户单击按钮时,使用JavaScript和DHTML(是利用CSS(层叠样式表),JavaScript,HTML等技术而建立的能与访问者产生互动的网页)立即更新UI,并向服务器发出异步请求,以执行更新或查询数据库。
当请求返回时,就可以使用JavaScript和CSS来相应地更新UI,而不是刷新整个页面。
最重要的是,用户甚至不知道浏览器正在与服务器通信:Web站点看起来是即时响应的虽然Ajax所需的基础架构已经出现了一段时间,但直到最近异步请求的真正威力才得到利用。
能够拥有一个响应极其灵敏的Web站点确实激动人心,因为它最终允许开发人员和设计人员使用标准的HTML/CSS/JavaScript堆栈创建“桌面风格的(desktop-like)”可用性。
Google Suggest、Google Maps所有这些Web站点都告诉我们,Web应用程序不必完全依赖于从服务器重新载入页面来向用户呈现更改。
ajax原理介绍AJAX全称为“Asynchronous JavaScript and XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。
主要包含了以下几种技术Ajax(Asynchronous JavaScript + XML)的定义基于web标准(standards-based presentation)XHTML+CSS的表示;使用 DOM(Document Object Model)进行动态显示及交互;使用 XML 和 XSLT 进行数据交换及相关操作;使用 XMLHttpRequest 进行异步数据查询、检索;使用 JavaScript 将所有的东西绑定在一起。
英文参见Ajax的提出者Jesse James Garrett的原文。
类似于DHTML或LAMP,AJAX不是指一种单一的技术,而是有机地利用了一系列相关的技术。
事实上,一些基于AJAX的“派生/合成”式,derivative/composite)的技术正在出现,如“AFLAX”。
AJAX的应用使用支持以上技术的web浏览器作为运行平台。
这些浏览器目前包括:Mozilla、Firefox、Internet Explorer、Opera、Konqueror及Safari。
但是Opera不支持XSL格式对象,也不支持XSLT。
与传统的web应用比较传统的web应用允许用户填写表单(form),当提交表单时就向web服务器发送一个请求。
服务器接收并处理传来的表单,然後返回一个新的网页。
这个做法浪费了许多带宽,因为在前後两个页面中的大部分HTML代码往往是相同的。
由于每次应用的交互都需要向服务器发送请求,应用的响应时间就依赖于服务器的响应时间。
这导致了用户界面的响应比本地应用慢得多。
与此不同,AJAX应用可以仅向服务器发送并取回必需的数据,它使用SOAP 或其它一些基于XML的web service接口,并在客户端采用JavaScript处理来自服务器的响应。
参数类型说明url 为string(因此要⽤引号引起来)发送请求的地址type string请求的⽅式:post或get请求。
默认为get请求data Object或string发送服务器的数据,键值对,字符串或对象,这⾥post请求有此参数,get请求直接在地址处?后⾯传参即可dataTypestring后端返回给前端的数据类型,⽐如html,xml,json。
本来是string,在ajax请求时设置dataType为json,将字符串;类型变为json类型succ ess function请求成功后调⽤的回调函数,需要操作的东西⼀般在这⾥写⽤法success:function(e 这个字母e可以是其他英⽂){写内容} 注意这个()⾥⾯的e或者说其他东西就是后端HttpResponse或者JsonResponse返回的东西,这⾥与dataType有关error function请求失败时调⽤的回调函数asyn c Boolean是否异步处理,默认为True,false为同步处理ajax--实现异步请求,接受响应及执⾏回调ajax最⼤的优点是在不重新加载整个页⾯的情况下,可以与服务器交换数据并更新部分⽹页的内容ajax指是⼀种创建交互式⽹页应⽤的⽹页开发技术,其实就是实现前后端交互。
1)ajax是异步javascript,异步的意思即⾮阻塞,就像线程,在代码运⾏到ajax请求时,它会分成两条线,⼀条线去运⾏ajax请求⾥⾯的内容,另⼀条线去运⾏主程序(即ajax请求后⾯的代码),当然我们可以因需要异步设置成同步(即在运⾏到ajax请求时,将阻塞运⾏完ajax请求后,再去运⾏ajax外,后⾯的代码)2)注意ajax请求是由jquery发起的,因此⽤于jquery代码块中。
3)执⾏相应的视图函数(这⾥是在⼀个py,php等⽂件中创建⼀个视图函数,或者class类,给这个视图函数分级设置⼀个url地址,ajax请求中的url即填写这个完整的url地址),返回json内容。
JQUERY AJAX异步操作详细说明AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和XML)。
它并非一种新的技术,而是以下几种原有技术的结合体。
1)使用CSS和XHTML来表示。
2)使用DOM模型来交互和动态显示。
3)使用XMLHttpRequest来和服务器进行异步通信。
4)使用javascript来绑定和调用。
通过AJAX异步技术,可以在客户端脚本与web服务器交互数据的过程中使用XMLHttpRequest对象来完成HTTP请求(Request)/应答(Response)模型:1)不需要用户等待服务端响应。
在异步派发XMLHttpRequest请求后控制权马上就被返回到浏览器。
界面不会出现白板,在得到服务器响应之前还可以友好的给出一个加载提示。
2)不需要重新加载整个页面。
为XMLHttpRequest注册一个回调函数,待服务器响应到达时,触发回调函数,并且传递所需的少量数据。
“按需取数据”也降低了服务器的压力。
3)不需要使用隐藏或内嵌的框架。
在XHR对象之前,模拟Ajax通信通常使用hack手段,如使用隐藏的或内嵌的框架(<iframe>标签)。
下面介绍下AJAX中的重要对象:XMLHttpRequest。
XMLHttpRequest对象(XHR)XMLHttpRequest是一套可以在Javascript、VbScript、Jscript等脚本语言中通过http协议传送或接收XML及其他数据的一套API。
XMLHttpRequest对象首次以ActiveX对象形式在微软Internet Explorer(IE) 5中以引入。
其他浏览器制造商在认识到这一对象重要性后也纷纷实现了XMLHttpRequest对象,但是以一个本地JavaScript对象而不是作为一个ActiveX 对象实现。
而如今,由于安全性、标准等问题,微软已经在其IE 7中把XMLHttpRequest实现为一个本地JavaScript对象。
AJAX(Asynchronous JavaScript and XML)是一种使用异步请求的技术,使得网页可以在不重新加载整个页面的情况下,与服务器进行通信和交换数据。
这样,就可以在不中断用户操作的情况下,更新部分网页内容。
AJAX 的工作原理:1. 创建 XMLHttpRequest 对象:AJAX 使用 XMLHttpRequest 对象来发送异步请求。
XMLHttpRequest 对象是所有现代浏览器(包括 Internet Explorer 7 及更高版本)都支持的一种对象。
2. 初始化 AJAX 请求:使用 XMLHttpRequest 对象的 open() 方法来指定请求的 URL、请求类型(如 GET 或 POST)、是否异步处理等。
3. 发送 AJAX 请求:使用 XMLHttpRequest 对象的 send() 方法来发送请求。
如果是 GET 请求,可以在 send() 方法的参数中传递查询字符串;如果是POST 请求,可以在 send() 方法的参数中传递要发送的数据。
4. 处理服务器响应:在 XMLHttpRequest 对象接收到服务器响应后,可以通过注册的 onreadystatechange 事件处理程序来处理响应数据。
当请求成功完成时(状态码为 200),responseText 属性将包含服务器的响应文本。
5. 更新网页内容:在收到服务器响应后,可以使用 JavaScript 来更新网页的内容,以反映服务器响应的数据。
同步请求和异步请求:* 同步请求:在同步请求中,浏览器会停止执行其他代码,直到服务器响应完成。
这意味着在等待服务器响应时,用户将无法使用浏览器。
同步请求通常用于提交表单数据,因为这需要等待服务器响应才能继续。
* 异步请求:在异步请求中,浏览器不会停止执行其他代码。
当发送异步请求时,浏览器会继续执行其他代码,而不会等待服务器响应。
一旦服务器响应,可以通过注册的事件处理程序来处理响应数据。
ajax底层原理Ajax(Asynchronous Javascript and XML)是一种用于在Web 应用程序中实现异步通信的技术。
它的底层原理是通过使用JavaScript和XMLHttpRequest对象与服务器进行数据交互,从而实现页面无需刷新即可动态更新内容的效果。
Ajax的工作原理可以简单概括为以下几个步骤:1. 创建XMLHttpRequest对象:在使用Ajax之前,首先需要创建一个XMLHttpRequest对象。
这个对象是浏览器提供的用于与服务器进行通信的接口。
在不同的浏览器中,创建XMLHttpRequest对象的方式可能会有所不同。
2. 发送请求:一旦创建了XMLHttpRequest对象,就可以使用它来发送请求。
Ajax可以使用GET或POST方法发送请求,具体使用哪种方法取决于开发者的需求。
发送请求时还可以附带一些数据,比如表单中的数据,以便服务器端进行处理。
3. 接收响应:当服务器接收到请求并处理完毕后,会将相应的数据返回给客户端。
客户端通过监听XMLHttpRequest对象的onreadystatechange事件来获取服务器的响应。
当readyState属性的值为4时,表示服务器的响应已经完全接收。
4. 更新页面:一旦接收到服务器的响应,就可以使用JavaScript来处理返回的数据,并将其更新到页面中的相应位置。
这样就实现了页面的动态更新,而无需刷新整个页面。
Ajax的底层原理是基于浏览器提供的XMLHttpRequest对象实现的。
XMLHttpRequest对象的核心功能是可以在不刷新整个页面的情况下与服务器进行数据交互。
通过使用这个对象,可以异步地向服务器发送请求,接收服务器的响应,并在页面上实时地更新内容。
Ajax的优势在于提高了用户的体验,减少了不必要的页面刷新。
由于只更新页面的一部分内容,可以大大减少数据传输量,提高了页面的加载速度。
此外,Ajax还可以实现与服务器的实时通信,比如聊天室、在线游戏等功能。
ajax async用法ajax async用法是指在使用ajax请求时,是否将请求设置为异步执行。
在ajax中,异步请求使得网页可以在请求发送给服务器之后继续进行其他操作,而不需要等待服务器响应。
这篇文章将一步一步回答关于ajax async 用法的问题。
第一步:什么是ajax?Ajax是一种网页开发技术,全称为“Asynchronous JavaScript and XML”(异步的JavaScript和XML)。
它允许网页通过JavaScript在后台与服务器进行通信,从而实现无需刷新整个页面的数据传输和交互。
使用ajax 可以改善用户体验,提高网页的性能和加载速度。
第二步:什么是异步请求?在web开发中,当一个请求被发送到服务器时,浏览器会停止处理其他的事务,直到服务器返回响应。
这种默认的同步请求方式会导致页面的加载和响应速度变慢。
异步请求是指将请求发送给服务器后,网页可以继续执行其他操作,并不需要等待服务器的响应。
第三步:如何设置异步请求?在ajax中,可以通过设置async参数为true或false来控制请求的异步性。
当参数为true时,请求为异步请求;当参数为false时,请求为同步请求。
默认情况下,async参数的值为true,即异步请求。
第四步:异步请求的优势是什么?异步请求具有以下几个优势:1. 提高用户体验:由于异步请求不需要等待服务器响应,网页可以继续进行其他操作。
用户可以在请求发送的同时继续浏览页面,不会感到页面的卡顿或等待。
2. 提高网页性能:异步请求可以减少页面加载时间,因为不需要等待服务器响应之后再加载其他内容。
网页可以在后台同时发送多个异步请求,从而提高网页的并发性能。
3. 节约带宽:由于不需要每次请求都加载整个页面,异步请求只传输需要的数据。
这可以节约带宽和服务器资源,并减轻服务器的负担。
第五步:异步请求的注意事项在使用异步请求时,需要注意以下几点:1. 异步请求的回调函数:异步请求需要设置回调函数来处理服务器的响应。
js ajax async用法English Answer:1. What is Asynchronous JavaScript and XML (Ajax)?Ajax is a set of web development techniques that enables web applications to communicate with a server asynchronously without reloading the entire page. This allows for dynamic and interactive web applications that can update content or send requests to the server without disrupting the user's experience.2. How Does Ajax Work?Ajax utilizes the XMLHttpRequest object to communicate with the server. It sends requests in the background to the server without reloading the page. The server responds with data, which is then parsed and used to update the web page. This allows for seamless integration of server-side data and client-side interactions.3. Benefits of Using Ajax:Improved User Experience: Ajax allows for faster and more responsive web applications without the need for page refreshes, enhancing the user's browsing experience.Dynamic Updates: Ajax enables web applications to update specific portions of the page dynamically, such as adding new items to a list or updating a status message, without reloading the entire page.Reduced Server Load: By sending only the necessary data to the server, Ajax reduces the server load and improves performance.4. How to Use Ajax with Async:The "async" attribute in Ajax is used to specify whether the request should be sent asynchronously. When set to "true," the request is sent in the background without waiting for a response from the server. This allows thebrowser to continue executing other tasks while waiting for the server's response.Example:javascript.var xhr = new XMLHttpRequest();xhr.open("POST", "/submit_form", true);xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");xhr.send("name=John&age=30");5. Considerations for Using Ajax:Browser Compatibility: Ajax requires support for the XMLHttpRequest object, which is supported by most modern browsers.Security: Ensure that Ajax requests are secured to prevent cross-site scripting (XSS) or other security vulnerabilities.Debugging: Debugging Ajax requests can be more challenging than traditional HTTP requests due to their asynchronous nature.Chinese Answer:1. 异步 JavaScript 和 XML (Ajax) 是什么?Ajax 是一组 Web 开发技术,它使 Web 应用程序能够与服务器异步通信,而无需重新加载整个页面。
ajax的流程随着互联网的发展,网页的交互性越来越重要,而Ajax技术的出现为实现网页的动态效果提供了很好的解决方案。
本文将介绍Ajax 的流程,包括Ajax的定义、工作原理、流程以及应用场景等。
一、Ajax的定义Ajax全称Asynchronous JavaScript and XML,即异步JavaScript 和XML。
它是一种用于在Web应用程序中创建交互式用户界面的技术,可以在不重新加载整个页面的情况下更新页面的部分内容。
Ajax技术的出现使得用户可以更加快速、方便地获取页面内容,提高了用户体验。
二、Ajax的工作原理Ajax技术的核心是JavaScript和XML。
JavaScript可以通过XMLHttpRequest对象向服务器发送请求,服务器将数据以XML格式返回给客户端,JavaScript再通过DOM操作将数据更新到页面上。
由于Ajax是异步的,也就是说,当JavaScript向服务器发送请求时,它不会停止页面的其他操作,而是在后台进行请求和数据处理,从而实现了页面的动态效果。
三、Ajax的流程1. 创建XMLHttpRequest对象在使用Ajax技术之前,需要先创建XMLHttpRequest对象。
XMLHttpRequest对象是JavaScript内置的对象,用于向服务器发送请求和接收响应。
2. 发送请求当XMLHttpRequest对象创建完成后,可以通过open()和send()方法向服务器发送请求。
其中,open()方法用于设置请求的类型、URL 和是否异步等信息,而send()方法用于发送请求。
3. 接收响应当服务器接收到请求后,会根据请求的类型和URL返回数据。
在客户端,XMLHttpRequest对象会监听服务器的响应,并通过onreadystatechange事件来处理响应。
当服务器返回响应时,XMLHttpRequest对象会触发onreadystatechange事件,开发者可以通过该事件来获取服务器返回的数据。
ajax的数据类型摘要:1.AJAX 简介2.AJAX 数据类型的含义3.AJAX 的数据类型分类4.实际应用中的数据类型示例5.结语正文:一、AJAX 简介AJAX(Asynchronous JavaScript and XML)即异步JavaScript 和XML,是一种用于在不重新加载整个页面的情况下,与服务器交换数据并更新部分网页内容的技术。
通过使用JavaScript 和XMLHttpRequest 对象,可以实现异步请求服务器数据,使得网页在加载时不需要等待数据完全加载,从而提高用户体验。
二、AJAX 数据类型的含义在AJAX 中,数据类型指的是服务器返回的数据的类型。
这些数据可以是HTML、XML、JSON、纯文本等不同格式的信息。
根据服务器返回的数据类型,AJAX 可以进行相应的处理,例如更新页面内容、处理错误信息等。
三、AJAX 的数据类型分类1.XML(可扩展标记语言):XML 是一种用于描述数据结构的标记语言。
在AJAX 中,服务器返回的XML 数据需要通过XML 解析器进行解析,然后根据解析结果更新页面内容。
2.JSON(JavaScript 对象表示法):JSON 是一种轻量级的数据交换格式,易于阅读和编写。
在AJAX 中,服务器返回的JSON 数据可以直接用JavaScript 进行解析和处理。
3.HTML:服务器返回的HTML 数据可以直接插入到页面的DOM(文档对象模型)中,用于更新页面内容。
4.纯文本:服务器返回的纯文本数据可以用于显示在页面上,或者作为其他处理的输入数据。
四、实际应用中的数据类型示例假设一个网页需要从服务器获取一篇文章的详细内容,服务器返回的数据可能是如下格式的JSON:```json{"title": "文章标题","author": "作者","content": "文章正文"}```在AJAX 请求成功后,JavaScript 可以根据返回的JSON 数据更新页面内容,例如显示文章标题、作者信息等。
ajax异步请求原理AJAX(Asynchronous JavaScript and XML)是一种无需刷新页面即可进行异步请求的技术,在Web开发中得到广泛应用。
其基本原理是利用JavaScript和XML(或JSON等)实现页面与服务器之间的无缝通信,从而实现动态更新页面内容、局部刷新网页等目的。
Ajax主要通过以下几个步骤进行异步请求:1. 创建XMLHttpRequest对象: 首先,在JavaScript代码中通过创建XMLHttpRequest 对象(常用标准写法是:new XMLHttpRequest()),来建立客户端与服务器的通信通道。
2. 通过XMLHttpRequest对象发送请求: 在发送请求之前,需要指定URL和HTTP请求方式,包括GET和POST。
此外,根据需要也可以设置一些请求头(如ContentType、UserAgent等)以及请求参数(在GET请求中,请求参数直接加在URL后;在POST请求中,则需要将参数放在HTTP请求体中)。
发送请求的方法是调用XMLHttpRequest对象的open()和send()方法。
3. 服务器处理请求: 一旦服务器接收到请求,就会进行相关处理(如查询数据库、生成动态页面等),最终返回一些数据(如HTML、XML、JSON等)给客户端。
这部分处理过程对于AJAX请求与一般HTTP请求来说是没有区别的。
4. 客户端处理响应: 浏览器客户端通过监听XMLHttpRequest对象的readyState属性,来判断当前请求所处的状态,常见的状态有4个:a. ReadyState=0: 初始状态,表示XMLHttpRequest对象已经被创建但还未初始化。
一旦XMLHttpRequest对象的readyState属性变成4,就表明服务器已经成功响应了AJAX请求,这时可以通过XMLHttpRequest对象的responseText或responseXML属性获取服务器响应的数据,并进行相关处理(如局部更新页面内容、显示提示信息等)。
ajax工作原理Ajax工作原理什么是Ajax?Ajax全称为Asynchronous JavaScript and XML,即异步 JavaScript 和 XML,是一种可以在不重新加载整个网页的情况下更新部分网页的技术。
它可以通过JavaScript向服务器发送请求并接收响应,然后使用JavaScript和DOM实现局部刷新,从而具有快速响应、提高用户体验等优点。
Ajax的工作方式1.通过XMLHttpRequest对象向服务器发送请求2.服务器接收到请求后处理请求,并返回相应的数据3.XMLHttpRequest对象接收到服务器返回的数据后,使用JavaScript和DOM技术对网页进行局部更新XMLHttpRequest对象XMLHttpRequest对象是Ajax的关键,它是由IE5引入的,现在已经成为大多数浏览器都支持的标准。
通过XMLHttpRequest对象,JavaScript可以和服务器进行数据交互。
XMLHttpRequest对象提供了一组方法用于向服务器发送请求、接收响应,并对请求状态进行处理。
其中常用的方法有:•open():初始化一个请求•send():发送请求•abort():取消当前请求Ajax的优点•增强用户体验:因为局部更新可以避免整个页面的重载,从而提高了用户体验和交互效果•提高性能:由于不需要每次重新加载整个页面,所以可以减少带宽的浪费和请求次数,从而可以提高网页的加载速度•易于使用:Ajax的应用可以与JavaScript、HTML和CSS等现有的Web技术结合使用,且容易掌握和实现Ajax的缺点•对搜索引擎不友好:将部分页面放在JavaScript中,搜索引擎对这些页面的抓取不友好,从而影响了SEO•对应用程序的开发难度较大:因为使用Ajax需要同时掌握JavaScript、XML以及Web服务器端技术的知识,因此初学者需要投入更多的时间和精力结论虽然Ajax有其自身的优缺点,但是它已经成为Web前端的基础技能之一。
Ajax介绍及重要应⽤场景向服务器发送请求的途径1、浏览器的地址栏:GET请求2、form表单:GET与POST均可3、a标签:GET请求4、Ajax:⽤的最多、最⼴5、其余的还有:link标签的href属性、img标签的src属性、script标签的src属性Ajax简介AJAX(Asynchronous Javascript And XML)翻译成中⽂就是“异步的Javascript和XML”。
即使⽤Javascript语⾔与服务器进⾏异步交互,传输的数据为XML(当然,传输的数据不只是XML,现在更多使⽤json数据)。
AJAX 不是新的编程语⾔,⽽是⼀种使⽤现有标准的新⽅法。
AJAX 最⼤的优点是在不重新加载整个页⾯的情况下,可以与服务器交换数据并更新部分⽹页内容。
(这⼀特点给⽤户的感受是在不知不觉中完成请求和响应过程)AJAX 不需要任何浏览器插件,但需要⽤户允许JavaScript在浏览器上执⾏。
a.同步交互:客户端发出⼀个请求后,需要等待服务器响应结束后,才能发出第⼆个请求; b.异步交互:客户端发出⼀个请求后,⽆需等待服务器响应结束,就可以发出第⼆个请求。
AJAX除了异步的特点外,还有⼀个就是:浏览器页⾯局部刷新;(这⼀特点给⽤户的感受是在不知不觉中完成请求和响应过程。
对于AJAX的操作,其实就是两点:⼀是向后台提交请求数据;⼆是回调函数接收到后台响应的数据后进⾏的处理。
简单事例利⽤ajax实现局部计算~urlpatterns = [...url(r'^ajax_add/', views.ajax_add),url(r'^ajax_demo1/', views.ajax_demo1),...]路由<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta http-equiv="x-ua-compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>AJAX局部刷新实例</title></head><body><input type="text" id="i1">+<input type="text" id="i2">=<input type="text" id="i3"><input type="button" value="AJAX提交" id="b1"><script src="/static/jquery-3.2.1.min.js"></script><script>$("#b1").on("click", function () {$.ajax({url:"/ajax_add/", //别忘了加双引号type:"GET",data:{"i1":$("#i1").val(),"i2":$("#i2").val()}, //object类型,键值形式的,可以不给键加引号success:function (data) {$("#i3").val(data);}})})</script></body></html>html⽂件def ajax_demo1(request):return render(request, "ajax_demo1.html")def ajax_add(request):#time.sleep(10) #不影响页⾯发送其他的请求i1 = int(request.GET.get("i1"))i2 = int(request.GET.get("i2"))ret = i1 + i2return JsonResponse(ret, safe=False)#return render(request,'index.html') #返回⼀个页⾯没有意义,就是⼀堆的字符串,拿到了这个页⾯,你怎么处理,你要做什么事情,根本就没有意义视图函数Ajax常见应⽤场景(1)搜索引擎根据⽤户输⼊的关键字,⾃动提⽰检索关键字。
1、ajax是什么?ajax: asynchronous javascript and xml: 异步的javascript和xml。
ajax是一种用来改善用户体验的技术,其本质是利用浏览器内置的一种特殊的对象(XMLHttpRequest)异步(即发送请求时,浏览器不会销毁当前页面,用户可以继续在当前页面做其它的操作)的向服务器发送请求,并且利用服务器返回的数据(不再是一个完整的页面,只是部分的数据,一般使用文本或者xml返回)来部分更新当前页面。
使用ajax技术之后,页面无刷新,并且不打断用户的操作。
2、ajax对象(1)如何获得ajax对象?XMLHttpRequest并没有标准化,要区分浏览器:function getXhr(){var xhr;if(window.XMLHttpRequest){xhr = new XMLHttpRequest(); // 非ie浏览器}else{xhr = new ActiveXObject('Microsoft.XMLHttp'); // ie浏览器}}(2)ajax对象的属性a. onreadystatechange: 绑订一个事件处理函数(即: 注册一个监听器)当ajax对象的readyState值发生了改变(比如,从0-->1),就会产生readystatechange事件。
b. responseText: 获得服务器返回的文本c. responseXML: 获得服务器返回的XML dom对象d. status: 获得状态码e. readyState: 返回ajax对象与服务器通讯的状态。
返回值是一个number 类型的值,不同的值表示不同的含义:0: (为初始化) --> 对象已建立,但是尚未初始化(尚未调用 open方法)1: (初始化) --> 对象已建立,尚未调用send方法2: (发送数据) --> send方法已调用3: (数据传送中) --> 已接受部分数据4: (响应结束) --> 接收了所有的数据(3)ajax编程的基本步骤1) 获取ajax对象(XmlHttpRequest)2)使用 XmlHttpRequest向服务器发送请求3)在服务器端处理请求4)在监听器当中,处理服务器返回的响应1) 获取ajax对象(XmlHttpRequest)var xhr = getXhr();2) 发送请求xhr.open(请求方式, 请求地址, 异步还是同步);请求方式: get/post请求地址:如果是get请求,请求参数要添加到请求地址的后面。