AJAX如何工作？

Question

AJAX如何工作？

Ver*_*tex 85 javascript ajax

AJAX的本质是什么？例如,我想在我的页面上有一个链接,以便当用户单击此链接时,一些信息将被发送到我的服务器,而无需重新加载当前页面.这是AJAX吗？

我能够通过使用isoframes来获得这种行为.在更多细节中,我在一个小的isoframe中放了一个链接(比如一个小图片).当用户单击此链接时,浏览器仅重新加载isoframe中的页面.

但是,我认为这不是达到目标的优雅方式.我想我必须使用AJAX.它是如何工作的？可以使用XHTML以优雅的方式解决所考虑的问题吗？或者我需要使用JavaScripts吗？

我不需要太多.我只想要一个小的链接(点击后)发送一些信息到服务器.假设我在消息附近有一个"星形图像".如果用户单击该星(他/她喜欢该消息),则更改颜色和我的服务器更新数据库(以记住该用户喜欢该消息).

Answer 1

Pas*_*ent 119

如果您对AJAX(代表异步Javascript和XML)完全陌生,那么维基百科上的AJAX条目是一个很好的起点:

与DHTML和LAMP一样,AJAX本身并不是一项技术,而是一组技术.AJAX使用以下组合:

用于标记和样式化信息的HTML和CSS.

使用JavaScript访问DOM以动态显示和与所呈现的信息交互.

一种在浏览器和服务器之间异步交换数据的方法,从而避免页面重新加载.通常使用XMLHttpRequest(XHR)对象,但有时会使用IFrame对象或动态添加的标记.

发送到浏览器的数据格式.常见格式包括XML,预格式化HTML,纯文本和JavaScript Object Notation(JSON).可以通过某种形式的服务器端脚本动态创建此数据.

正如您所看到的,从纯粹的技术角度来看,这里没有什么新东西.大多数AJAX部件已经在1994年(1999年用于XMLHttpRequest对象).真正的新奇是使用这些部件一起为谷歌与GMail的(2004)和谷歌地图(2005)一样.实际上,这两个网站都为推广AJAX做出了巨大贡献.

一张图片胜过千言万语,下图说明了客户端和远程服务器之间的通信,以及经典和AJAX驱动的应用程序之间的差异:

替代文字

对于橙色部分,您可以手动(使用XMLHttpRequest对象)完成所有操作,或者您可以使用着名的JavaScript库(如jQuery,Prototype,YUI等)来"AJAXify"应用程序的客户端.这些库旨在隐藏JavaScript开发的复杂性(例如跨浏览器兼容性),但对于一个简单的功能可能有点过分.

在服务器端,一些框架也可以提供帮助(例如DWR或RAJAX,如果您使用的是Java),但您需要做的只是公开一个只返回部分更新页面所需信息的服务(最初为XML)/XHTML - AJAX中的X - 但现在通常首选JSON).

Answer 2

bra*_*ter 17

AJAX通常涉及从客户端向服务器发送HTTP请求并处理服务器的响应,而无需重新加载整个页面.(异步).

Javascript通常会提交并从服务器接收数据响应(传统的XML,通常是其他不那么冗长的格式,如JSON)

然后,Javascript可以动态更新页面DOM以更新用户的视图.

因此'异步Javascript和XML'.

还有其他选项可以在不重新加载页面的情况下更新用户的视图,例如Flash和Applet,但这些对您的案例来说听起来不是很好的解决方案.听起来像Javascript是要走的路.有很多好的库支持,就像在这个站点上使用的jQuery一样,所以你不需要自己编写很多Javascript.

Answer 3

Jef*_*nal 17

AJAX的本质是:

当用户执行其他操作时,您的页面可以浏览Web并更新自己的内容.

也就是说,您的javascript可以发送异步GET和POST请求(通常通过XMLHttpRequest对象),然后使用这些请求的结果来修改其页面(通过文档对象模型操作).

Answer 4

eng*_*ran 13

Ajax不仅仅是重新加载页面的一部分.Ajax代表Asynchronous Javascript和Xml.

您需要的Ajax的唯一部分是来自javascript 的XMLHttpRequest对象.您必须使用它来加载和重新加载html的一小部分作为div或任何其他标记.

阅读那个例子,你会更快地成为专业人士!

<html>
<body>

<script type="text/javascript">
function ajaxFunction()
{
var xmlhttp;
if (window.XMLHttpRequest)
  {
  // code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else if (window.ActiveXObject)
  {
  // code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
else
  {
  alert("Your browser does not support XMLHTTP!");
  }
xmlhttp.onreadystatechange=function()
{
if(xmlhttp.readyState==4)
  {
  document.myForm.time.value=xmlhttp.responseText;
  }
}
xmlhttp.open("GET","time.asp",true);
xmlhttp.send(null);
}
</script>

<form name="myForm">
Name: <input type="text" name="username" onkeyup="ajaxFunction();" />
Time: <input type="text" name="time" />
</form>

</body>
</html>

Run Code Online (Sandbox Code Playgroud)

Answer 5

Dav*_*sky 5

AJAX代表异步Javascript和XML.AJAX支持对页面的部分更新,而无需将整个页面发布回服务器.

AJAX有很多选择.最值得注意的两个(可以说是)微软的ASP.NET AJAX(以前的Atlas)和jQuery.

如果您已经熟悉ASP.NET,那么ASP.NET AJAX相对容易设置.如果您已经了解javascript,jQuery很好,并且可以非常精细地控制页面的查询和更新.

HTH

Answer 6

小智 1

那就是阿贾克斯。没有 javascript 就无法使用 ajax。您应该查看 jquery 和原型示例以了解用法。

呵呵。我听说 AJAX 是异步 JavaScript 和 XML。除了它不一定是异步的、不一定是 JavaScript、也不一定是 XML 之外。 (7认同)

归档时间：	16 年前
查看次数：	82805 次
最近记录：	10 年，3 月前