本文中将使用工具轻松构建终极的Hello World mashup：Google地图mashup……

　　Web开发的新纪元达到了顶峰，这一阶段称为 Web2.0。这一时期迎来了新一批原型化Web 应用程序，包括blog、wiki和mashup。 Mashup是本教程论述的重点，您将了解到如何使用一组通用技术构建一个示例 mashup 。这组技术包括 JavaScript、Ajax、REST、JSON 和Google地图API。 作为 Web开发人员，了解如何结合使用这些工具很重要。

　　简介

　　所谓Mashup，就是在将一些数据源和服务组合到一起创建一种新功能或以某种方式添加新值的时候创建的。本教程将介绍如何创建一个Google地图mashup —— 将 Google 地图提供的地图数据与您自己创建的方位数据服务相结合。

　　本教程分为三部分：

• 　　Web2.0工具箱
• 　　从一个REST 数据服务检索方位
• 　　用 Google 地图标绘地址

　　第一部分介绍了我在第二部分和第三部分构建 mashup 时所用的技术。

　　Web 2.0 工具箱

　　Web开发人员很清楚技术总是在不断地进步，技能在几年之内就会变得过时。我对此并无异议：创新使得 Web开发变得有趣。新主张、新工具和新技术让我们能够在更短的时间内构建更出色的系统。本节将介绍一些您可能用过也可能没有用过的技术。如果这些对于您来说是新技术，可以将本小节的内容看作快速入门，在此之后，我鼓励您继续深入学习。下文所述内容并不完整，在某些方面过于简略，这样做是为了传达重要的概念。

　　虽然我要讨论多种技术，但是本教程也需要从头说起。我假定您熟悉以下概念和Web 技术：

• 　　HTML
• 　　XML
• 　　浏览器和 Web 服务器的角色
• 　　HTTP 请求/响应模型
• 　　现代编程语言，例如Java、JavaScript、PHP 和 C#

　　客户端编程

　　Web2.0 应用程序的特征是高度的交互性——它像传统桌面应用程序那样进行响应。传统 Web 应用程序一成不变的外观和刷新整个页面的长时间中断都无法满足这一期望。 因此，Web2.0 应用程序利用了客户端编程技术来帮助应用程序获得更快的响应速度。两种最流行的客户端技术是 JavaScript 和 Adobe Flex。 这两种技术都具备令人叹服的特性，在应用上都取得了巨大的成功。然而，为了缩小本教程的讨论范围，在构建 mashup 的时候，我仅考虑JavaScript 方法。

　　JavaScript 技术成熟。它是一种强大的客户端编程语言，已经流行数年。随着标准的不断改进，跨浏览器支持显著进步，使得它成为一种可行的方法。对于那些没有接触过这门语言的人来说，会发现它的基本代码构造和其他主流语言(例如 Java)类似。

　　JavaScript包含一种功能强大的事件机制，使得 JavaScript 能够响应浏览器中的用户交互。我将使用事件响应功能来构建下文的mashup。学习HTML的人已经见过以事件的形式表现的JavaScript 事件响应机制，例如下面代码中的 onclick 属性：

　　JavaScript 在浏览器中执行时的另一个重要功能就是能够操纵 HTML 文档对象模型(HTML Document Object Model，DOM)。该功能允许 JavaScript 代码在 HTML 页面加载后以编程方式改变页面内容。DOM 操纵是提高Web 2.0 应用程序交互性时使用的重要功能。在 Web 应用程序中，重置 HTML 中一个元素所包含的文本很常见，例如：