为什么要用ajax框架
ajax是技术,不是框架,ajax的框架是指这些:dwr或jquery或ext这一类的东西。
至于 为什么要用它们呢,主要是它们给我们做了一些封装,使得我们的应用变得简单。
Ajax是什么东西
AJAX即“Asynchronous JavaScript and XML”(异步JavaScript和XML),AJAX并非缩写词,而是由Jesse James Gaiiett创造的名词,是指一种创建交互式网页应用的网页开发技术。
传统的web应用允许用户填写表单(form),当提交表单时就向web服务器发送一个请求。服务器接收并处理传来的表单,然后返回一个新的网页。这个做法浪费了许多带宽,因为在前后两个页面中的大部分HTML代码往往是相同的。由于每次应用的交互都需要向服务器发送请求,应用的响应时间就依赖于服务器的响应时间。这导致了用户界面的响应比本地应用慢得多。 与此不同,AJAX应用可以仅向服务器发送并取回必需的数据,它使用SOAP或其它一些基于XML的web service接口,并在客户端采用JavaScript处理来自服务器的响应。因为在服务器和浏览器之间交换的数据大量减少,结果我们就能看到响应更快的应用。同时很多的处理工作可以在发出请求的客户端机器上完成,所以Web服务器的处理时间也减少了。 使用Ajax的最大优点,就是能在不更新整个页面的前提下维护数据。这使得Web应用程序更为迅捷地回应用户动作,并避免了在网络上发送那些没有改变过的信息。 Ajax不需要任何浏览器插件,但需要用户允许JavaScript在浏览器上执行。就像DHTML应用程序那样,Ajax应用程序必须在众多不同的浏览器和平台上经过严格的测试。随着Ajax的成熟,一些简化Ajax使用方法的程序库也相继问世。同样,也出现了另一种辅助程序设计的技术,为那些不支持JavaScript的用户提供替代功能。 对应用Ajax最主要的批评就是,它可能破坏浏览器后退按钮的正常行为。在动态更新页面的情况下,用户无法回到前一个页面状态,这是因为浏览器仅能记下历史记录中的静态页面。一个被完整读入的页面与一个已经被动态修改过的页面之间的差别非常微妙;用户通常都希望单击后退按钮,就能够取消他们的前一次操作,但是在Ajax应用程序中,却无法这样做。不过开发者已想出了种种办法来解决这个问题,当中大多数都是在用户单击后退按钮访问历史记录时,通过建立或使用一个隐藏的IFRAME来重现页面上的变更。(例如,当用户在Google Maps中单击后退时,它在一个隐藏的IFRAME中进行搜索,然后将搜索结果反映到Ajax元素上,以便将应用程序状态恢复到当时的状态。) 一个相关的观点认为,使用动态页面更新使得用户难于将某个特定的状态保存到收藏夹中。该问题的解决方案也已出现,大部分都使用URL片断标识符(通常被称为锚点,即URL中#后面的部分)来保持跟踪,允许用户回到指定的某个应用程序状态。(许多浏览器允许JavaScript动态更新锚点,这使得Ajax应用程序能够在更新显示内容的同时更新锚点。)这些解决方案也同时解决了许多关于不支持后退按钮的争论。 进行Ajax开发时,网络延迟——即用户发出请求到服务器发出响应之间的间隔——需要慎重考虑。不给予用户明确的回应 ,没有恰当的预读数据 ,或者对XMLHttpRequest的不恰当处理,都会使用户感到延迟,这是用户不欲看到的,也是他们无法理解的。通常的解决方案是,使用一个可视化的组件来告诉用户系统正在进行后台操作并且正在读取数据和内容。 一些手持设备(如手机、PDA等)现在还不能很好的支持Ajax; 用JavaScript作的Ajax引擎,JavaScript的兼容性和DeBug都是让人头痛的事; Ajax的无刷新重载,由于页面的变化没有刷新重载那么明显,所以容易给用户带来困扰――用户不太清楚现在的数据是新的还是已经更新过的;现有的解决有:在相关位置提示、数据更新的区域设计得比较明显、数据更新后给用户提示等; 对串流媒体的支持没有FLASH、Java Applet好
Ajax 是什么 如何创建一个Ajax
Ajax并不算是一种新的技术,全称是asychronous javascript and
xml,可以说是已有技术的组合,主要用来实现客户端与服务器端的异步通信效果,实现页面的局部刷新,早期的浏览器并不能原生支持ajax,可以使用隐藏帧(iframe)方式变相实现异步效果,后来的浏览器提供了对ajax的原生支持
使用ajax原生方式发送请求主要通过XMLHttpRequest(标准浏览器)、ActiveXObject(IE浏览器)对象实现异步通信效果
基本步骤:
var xhr =null;//创建对象 if(window.XMLHttpRequest){ xhr = new XMLHttpRequest();}else{ xhr = new ActiveXObject(“Microsoft.XMLHTTP“);} xhr.open(“方式”,”地址”,”标志位”);//初始化请求 xhr.setRequestHea
by三人行慕课
AJAX是什么
AJAX是创建交互式网页应用的网页开发技术的一种。
Ajax = 异步 JavaScript 和 XML 或者是 HTML(标准通用标记语言的子集)。可以用于创建快速动态网页的技术。在无需重新加载整个网页的情况下,能够更新部分网页的技术。通过在后台与服务器进行少量数据交换,Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
传统的网页(不使用 Ajax)如果需要更新内容,必须重载整个网页页面。
扩展资料
Ajax 开发与传统的 B/S开发有很大的不同。这些不同引入了新的编程问题,最大的问题在于易用性。由于 Ajax 依赖浏览器的 JavaScript 和XML,浏览器的兼容性和支持的标准也变得和 JavaScript 的运行时性能一样重要了。
综合各种变化的技术和强耦合的客户服务端环境,Ajax 提出了一种新的开发方式。Ajax 开发人员必须理解传统的 MVC 架构,这限制了应用层次之间的边界。同时,开发人员还需要考虑 B/S 环境的外部和使用 Ajax 技术来重定型 MVC 边界。
最重要的是,Ajax 开发人员必须禁止以页面集合的方式来考虑 Web 应用而需要将其认为是单个页面。一旦 UI 设计与服务架构之间的范围被严格区分开来后,开发人员就需要更新和变化的技术集合了。
Ajax的优点和缺点
优点:能在不更新整个页面的前提下维护数据。这使得Web应用程序更为迅捷地回应用户动作,并避免了在网络上发送那些没有改变的信息。Ajax不需要任何浏览器插件,但需要用户允许JavaScript在浏览器上执行。
缺点:破坏浏览器的后退与加入收藏书签功能。一个被完整读入的页面与一个已经被动态修改过的页面之间的可能差别非常微妙;用户通常都希望单击后退按钮,就能够取消他们的前一次操作,但是在Ajax应用程序中,却无法这样做。
应用
Ajax前景非常乐观,可以提高系统性能,优化用户界面。Ajax现有直接框架AjaxPro,可以引入AjaxPro.2.dll文件,可以直接在前台页面JavaScript调用后台页面的方法。但此框架与表单验证有冲突。另外微软也引入了Ajax组件,需要添加AjaxControlToolkit。dll文件,可以在控件列表中出现相关控件。
以上内容参考:百度百科-ajax
ajax框架
ajax涉及客户端和服务器端的互动,其原理很简单,现在的浏览器都有一个XMLHttpRequest对象,这个对象可以向服务器端发送数据,服务器端收到数据之后经过处理可以发回反馈(状态或者新数据),那个XHR对象负责接收反馈这时候你的javascript代码可以通过XHR对象暴露出的接口对数据进行处理。整个过程不需要浏览器提交刷新网页,所以可以让用户获得即时反馈。所以Ajax是一个客户端服务器端互动的过程,Javascript只是帮助你进行客户端编码,服务器端你也同样需要做工作。这就是为什么Ajax框架不叫做javascript框架的原因,当然也有一些纯粹的javascript框架提供一些工具帮助你在客户端编码。
Ajax框架分为Client Centric和Server Centric两种,都是用于帮助开发Ajax交互代码,前者包括纯粹的Javascript框架比如prototype,jquery等等,也有使用Java编码,然后再按编译成javascript的,像GWT(Google Web Toolkit),后者的典型是ZK框架。你可以在维基百科中查询关于这些框架的更多的情况
ajax框架 问题
Ajax是时下比较流行的一种web界面设计新思路,其核心思想是从浏览器获取XMLHttp对象与服务器端进行交互. DWR(Direct Web Remoting)就是实现了这种Ajax技术的一种web框架. 最近做的项目中我也将它用上了,感觉很是方便,比如动态生成java
Ajax概念
(异步的javascript和xml),ajax并不是一门新的技术,而是多种技术的组合(html,js,xml,css)用于快速的创建动态的网页,能够实现无刷新更新数据从而提高了用户体验
由客户端请求ajax引擎,在由ajax引擎请求服务器,服务器作出一系列的响应之后将结果返回给ajax引擎,由ajax引擎决定将这个结果写入到客户端的什么位置,从而实现了页面无刷新更新数据
XMLHttpReques
优点:能够减轻服务器的负担页面无刷新提高用户体验
缺点:不利于seo搜索引擎的优化
get和post是最常用的两种HTTP请求方法,前者用于获取数据,后者用于修改数据。来自 w3 的对比:
方法GET POST
后退按钮/刷新无害数据会被重新提交(浏览器应该告知用户数据会被重新提交)。
书签可收藏为书签不可收藏为书签
缓存能被缓存不能缓存
编码类型application/x-www-form-urlencodedapplication/x-www-form-urlencoded 或 multipart/form-data。为二进制数据使用多重编码。
历史参数保留在浏览器历史中。参数不会保存在浏览器历史中。
对数据长度的限制是的。当发送数据时,GET 方法向 URL 添加数据;URL 的长度是受限制的(URL 的最大长度是 2048 个字符)。无限制。
对数据类型的限制只允许 ASCII 字符。没有限制。也允许二进制数据。
安全性与 POST 相比,GET 的安全性较差,因为所发送的数据是 URL 的一部分。在发送密码或其他敏感信息时绝不要使用 GET !POST 比 GET 更安全,因为参数不会被保存在浏览器历史或 web 服务器日志中。
可见性数据在 URL 中对所有人都是可见的。数据不会显示在 URL 中。
注:关于URL 的长度是受限制的这一点是不对的,HTTP协议并没有限制URI的长度,具体的长度是由浏览器和系统来约束的。
// 1 .创建Ajax对象
let xhr = new XMLHttpRequest();
console.log(xhr.readyState); //0 初始值
// 2明确请求地址和请求方式,初始化请求
// 请求方式有四种: GET,POST,PUT,DELETE 常用的
// 请求直至包括: 真实的后台接口, 本地的JSON文件, 注意: 支持本地JSON文件只支持GET
xhr.open(’GET’, ’./stus.json’)
console.log(xhr.readyState); //1 发送请求
//3 发送请求
xhr.send()
4. // 设置请求头信息,定义Content-Type的格式
// application/x-www-form-urlencoded表示参数数据的格式是url格式
// xhr.setRequestHeader(’Content-Type’,’application/x-www-form-urlencoded’)
// application/json表示参数数据的格式是json格式
xhr.setRequestHeader(’Content-Type’,’application/json’)
// 5 注册一个onreadystatechange,监听回传的值
xhr.onreadystatechange = function() {
//readyState读取状态值变为2,表示请求发送成功
//readyState读取状态值变为3,表示服务器成功接收到请求并开始响应
//readyState读取状态值变为4,表示服务器响应完成
console.log(xhr.readyState);
// 请求已经完成
if (xhr.readyState === 4) {
// status响应状态码:200表示成功,404表示资源不存在,500是服务器错误
if (xhr.status === 200) {
// JSON.parse()方法,用于将JSON格式的字符串转为js对象
let date = JSON.parse(xhr.responseText)
console.log(date);
}
}
}