创建动态的 Firefox 用户界面

级别： 中级

Adam Pilkington , 软件工程师, IBM

2008 年 1 月 30 日

	现在注册或者使用您的 IBM ID 和密码登录。

在创建基于浏览器显示 XML 数据提要的应用程序时，常常需要编写数据获取机制和用户界面。Mozilla Firefox 为这些任务提供了基础结构，让开发人员可以把注意力集中在应用程序功能上。学习如何使用 Asynchronous JavaScript + XML（Ajax）从 Web 服务器下载 XML 数据，以及如何使用 Extensible Stylesheet Language Transformations（XSLT）将 XML 数据动态地转换为用 XML User Interface Language（XUL）表达的 Firefox 用户界面元素。可以将这些技术应用于使用 XML 数据源的任何应用程序。实际上，Firefox 浏览器就是使用 XUL 构建的。

在本教程中

本教程通过一个示例应用程序讲解如何组合使用 XUL、XSLT 和 Ajax 来生成动态的用户界面。在学完本教程之后，您就能够对用来驱动 Firefox 应用程序的任何 XML 数据源应用这些技术。

请访问 Ajax 技术资源中心，这是有关 Ajax 编程模型信息的一站式中心，包括很多文档、教程、论坛、blog、wiki 和新闻。任何 Ajax 的新信息都能在这里找到。 订阅 Ajax 相关文章和教程的 RSS

目标

• 定义一个动态填充的用户界面骨架。
  
  
• 使用 Ajax 将 XML 数据下载到 Firefox 中。
  
  
• 使用 XSLT 创建 XUL 元素，然后添加到应用程序中。
  

预备知识

您需要基本了解 XML 和 XSLT，应该熟悉简单的 XML 数据转换。还需要熟悉 XUL（用来定义 Firefox 用户界面的语言）。您可以通过文末 更多参考资源 来了解更多关于 XUL 的基础知识。最后，还应该能够编写或理解 JavaScript，因为 JavaScript 是连接所有这些技术的 “粘合剂”。

系统需求

要想运行本教程中开发的示例应用程序，需要使用 Firefox Version 2 浏览器和支持 PHP 的 Web 服务器。

您还需要在浏览器中启用 JavaScript。

分享本教程…… 提交到 Digg 发布到 del.icio.us Slashdot 一下！

学习时间

1 小时

语言

格式

更多参考资源

• 通过教程 XML 用户界面语言（XUL）开发入门 学习 XUL 开发的入门知识。
• XUL － 快速开发跨平台易用用户接口的新途径: 这是一篇关于 XUL 简介和应用的入门文章。
• 参考 “使用 XUL 实现浏览器扩展”系列，了解 XUL 在 Mozilla Firefox 浏览器中的应用。
  • 使用 XUL 实现浏览器扩展，第 1 部分: 使用用户界面特性创建一个 Firefox 浏览器扩展
  • 使用 XUL 实现浏览器扩展，第 2 部分: 组建一个跨平台的 Firefox 扩展
• 参考“Firefox 1.5 中的 XML”系列：
  • Firefox 1.5 中的 XML，第 1 部分: XML 特性概述
  • Firefox 1.5 中的 XML，第 2 部分: 基本 XML 处理
• “用 Mozilla 和 XML 创建 Web applet: Mozilla 简单灵活的 XUL 可以节省创建非-Java applet 的时间”：了解如何使用 XUL——一种新方法——直接用 XML 编写和显示应用程序，创建跨平台的 GUI 元素。
• 参考 developerWorks 其他 关于 XUL 的技术文章 或 关于 XUL 的学习教程。

回页首