当前位置:K88软件开发文章中心编程语言AjaxAjax01 → 文章内容

详谈基于JSON的高级AJAX开发技术

减小字体 增大字体 作者:佚名  来源:翔宇亭IT乐园  发布时间:2019-1-3 0:42:07

在方括号内,这些方括号代表了父对象(即Auto)。这意味着,该串行化的JavaScript对象能够在运行时刻被发送到服务器端以存储最新的数据,并且也可以在应用程序启动时从服务器端进行接收以便从数据库中检索多数的当前数据。最精彩的部分在于,为了创建一种“无缝”的过程,所有与服务器之间实现的数据交换都可以使用JSON技术来实现。

  下面,让我们来看一下相同的数据是如何从服务器端接收的,以及它们是如何被使用最新的数据(典型地,来源于一个数据库)串行化为客户端JavaScript对象的。

  五、 把JSON反串行化为客户端JavaScript对象

  在本文中,我简单地把一个静态文件创建为JSON响应,但是在实际开发中,你可以把这些数据存储在一个数据库中并且使用一种服务器端语言返回它。基于这一能力,我们就可以轻松地创建一种强有力的数据交换过程!在前面,我们已经分析了这一串行化过程。凭基本的AJAX体验,你应该能够理解数据是如何被寄送到服务器端的。现在,让我们着手讨论反串行化的问题。首先来看一个针对本文示例提供的静态JSON文件。这个文件其实是我们在上一节中串行化的数据:

{"Car":{"color":"#333","Wheel":{"color":"#000"}}}

  作为一个请求JSON文件的示例,当我们点击下列链接时将请求这个串行化的Auto对象:

<a href="javascript:AjaxUpdater.Update(’GET’, ’json/data.js’, displayResponse);">Get remote JSON</a>

  一旦接收到响应消息,我们的称为displayResponse回调方法就会被激活,然后,我们就能够反串行化并开始使用这些对象:

<script type="text/javascript">
function displayResponse()
{
 if(Ajax.checkReadyState(’loading’) == "OK")
 {
  var Auto = Ajax.request.responseText.parseJSON();
  document.getElementById("body").innerHTML += "
<b>Remote JSON unserialized</b>";
  document.getElementById("body").innerHTML += "
Car color: "+Auto.Car.color;
  document.getElementById("body").innerHTML += "
Wheel color: "+Auto.Car.Wheel.color;
 }
}
</script>

  这是相当激动人心的一部分!一旦我们拥有了该responseText,我们就能够简单地使用JSON分析器中的parseJSON方法来从串行化的数据中重建我们的Auto对象。借助于这个新的Auto对象,我们就可以调用相应的子对象。这个特征允许我们在服务器和客户端来回发送对象—而不必进行大量的分析工作,然而在以前标准的XML响应情况下我们将却必须这样做。这样以来,我们就可以创建出能够基于AJAX技术来保留自身状态的客户端JavaScript对象

上一页  [1] [2] 


详谈基于JSON的高级AJAX开发技术