HTML 和当前 Web 浏览器的替代方案

• 下载示例 Web 应用程序的源代码 - 10 Kb
• 下载 Web 浏览器 - 596 Kb

引言

目前，Web 浏览器使用一种标记语言，即 HTML 来显示网页。它们都以基本相同的方式读取和显示它。换句话说，就是一堆不同的 Web 浏览器都在做同样的事情。然而，情况并非一定如此。支持网页和 Web 浏览器的协议 HTTP，支持的不仅仅是当前浏览 Web 的方式。

本文的目的是提出一种替代当前用户浏览万维网方式的方案。

背景

Web 上最流行的标记语言是 HTML。有大量的浏览器支持它，数百万个网页是用它编写的。然而，它并不是创建网页的唯一方式。网页可以用任何语言编写，只要你愿意创建支持它的 Web 浏览器。它不必像其他任何 Web 浏览器一样运行。它可以被设计成以多种不同的方式读取和显示网页。

在我们继续之前，让我们回顾一下 Web 浏览器领域多年来的变化。

20 世纪 90 年代初

当万维网刚刚起步时，Web 浏览器制造商规模小且缺乏组织。当时的目标是创建一个能够可靠地与 HTML 配合使用的 Web 浏览器。添加功能并不是一个大问题，因为仅仅让软件不要每隔几秒钟崩溃一次就已经足够具有挑战性了。

20 世纪 90 年代中期

让我们快进到 20 世纪 90 年代中期。Netscape 主导了市场，而微软则刚刚开始在 Web 浏览器市场崭露头角。Netscape 意识到当前的 HTML 对于他们希望在 Web 上执行的某些 Web 任务来说是不够的。那么，猜猜怎么着？他们发明了 JavaScript 并将其添加到他们的 Web 浏览器中。这开始了功能竞赛。一旦微软看到了 JavaScript 的受欢迎程度，他们意识到也必须将其包含在他们的 Web 浏览器中。因此，在接下来的几年里，Netscape 和微软试图通过为他们的浏览器和 HTML 添加功能来超越对方。

1998 年至今

经过所有的竞争和相互超越的尝试，不可避免的事情发生了。微软获得了 Web 浏览器市场的完全主导地位，并且他们一直持续至今，添加了符合他们对 Web 看法的功能，而其他所有人都只是随波逐流。

好吧，信不信由你，情况并非一定如此。只要有足够的时间和意愿，任何人都可以构建一个 Web 浏览器，而且它不必像其他任何 Web 浏览器那样运行。本文描述了我尝试创建一种标记语言和 Web 浏览器，作为 HTML 的替代方案。这是描述如何使用这种替代方案来浏览 Web 的系列文章之一。

GordonRhodes 标记语言 (GRML) 环境

本文讨论的浏览万维网的方法使用了 GRML。GRML 需要以下组件：

• 一个 Web 浏览器，如 Pioneer，用于加载文件或下载网页；
• 一个 Web 服务器，如 IIS 或 Apache，用于服务器端处理和托管；以及
• 一个开发环境或文本编辑器，如 Notepad 或 Visual Interdev，用于创建 GRML 文件和 Web 页面以供 Web 浏览器使用。

GordonRhodes 标记语言 (GRML) 是一种网页标记语言，用于组织数据以在 GRML Web 浏览器中显示。

尽管是 HTML 的替代方案，GRML 仍然依赖于许多现有的万维网技术。这意味着您在使用 ASP、JSP、CGI、PHP、.NET 或 XML 时获得的经验和技能可用于创建 GRML 文档。事实上，您可以使用服务器端技术从 HTML 文件生成 GRML。为了更清楚地了解 GRML 的属性，让我们看看它的一些优点和缺点。

GRML 非常适合执行以下操作的网页和文件：

• 显示结构化数据（例如，拍卖结果、数据库记录），或
• 显示多维数据（例如，天气状况、购房、旅行计划），或
• 显示数据列表（例如，新闻头条、链接列表），或
• 显示图片库。

GRML 不适合以下网页和文件：

• 显示非结构化数据（例如，文章、故事），或
• 显示广告，或
• 使用间谍软件，或
• 使用脚本和 Flash，或
• 允许玩游戏。

现在，让我们来研究 GRML，以了解它是如何工作的以及它为 Web 浏览体验带来了什么。我们将从 Pioneer Web 浏览器开始，并研究它如何使用 GRML 文件和网页来显示数据。

Pioneer

典型的 GRML Web 浏览器可以通过它执行的一个主要功能（除了浏览 Web）来描述。例如，GRML Web 浏览器可能专注于图像编辑、数据录入或文字处理。Pioneer 是一款结果查看器，具有图片预览和缩略图支持的 Web 浏览器。

每个 Web 浏览器都分为三个类之一：多文档界面 (MDI)、单文档界面 (SDI) 或对话框。Pioneer 是一款 MDI Web 浏览器，并在 MDI 子窗口中显示所有网页或文件内容。每个子窗口称为一个 **数据窗口**，由一个 *输入表单* 和一个 *结果区域* 组成。所有 **数据窗口** 所在的区域称为工作区。

为了方便导航工作区并查看哪些“数据”窗口已打开，Pioneer 提供了一个 **工作区窗口**。此窗口允许您轻松查看哪些 **数据窗口** 已打开，它们的相关属性，以及哪个 **数据窗口** 具有焦点。

**工作区窗口** - 以树状视图显示工作区中的打开数据窗口。

除了“工作区”和 **工作区窗口** 之外，Pioneer 还记录了用户可能进行的请求。这些请求存储在注册表中，并在 **历史记录窗口** 中显示。在这里，您无需重新输入请求或 URL，只需双击该项目即可自动下载（就像超链接一样）。

**历史记录窗口** - 显示用户之前输入的请求。

（上图：拍卖）

（上图：职位）

（上图：链接）

在数据窗口中提交请求时，您将使用其输入控件。这些控件（例如，编辑框、组合框等）将构成发送到网站的请求。输入请求后（当控件具有焦点时），按“Enter”键发送请求。

**数据窗口** *输入表单* - 显示 Web 应用程序的用户输入控件。

（上图：拍卖输入控件）

（上图：职位搜索输入控件）

提交请求后，Pioneer 会检索并解析网页中的 GRML。然后，它会在 *结果区域* 中显示结果。该区域位于 **数据窗口** 的 *输入表单* 下方。*结果区域* 提供四种视图的内容：“报表”、“水平列表”、“垂直列表”和“缩略图”（如果有图像）。

**数据窗口** *结果区域* - 缩略图视图（例如，Ebay 拍卖结果，搜索“梅赛德斯 s500”——我也可以做梦，不是吗？）。

**数据窗口** *结果区域* - 报表视图（Monster.com 职位列表，搜索“java la”）。

有时，在查看结果时，所有属性都无法放入数据窗口。这意味着您需要滚动才能看到所有内容。如果您希望一次性查看所有属性，有两个选项。一种是突出显示项目并查看工具提示。另一种是使用 **详细信息窗口**。此窗口包含所选结果中的所有文本。例如，使用“java la”搜索职位列表的报表视图中的第一个结果在 **详细信息窗口** 中显示如下：

详细信息窗口

当请求返回图像时，**图片窗口** 会显示所选结果的图像。例如，在拍卖搜索“梅赛德斯 s500”的缩略图视图中的第一个项目在 **图片窗口** 中显示如下：

图片窗口

将所有内容放在一起，看起来就像这样：

（上图：拍卖）

（上图：职位搜索）

使用 Web 浏览器

当用户首次启动 Web 浏览器时，他们可以做的第一件事是输入一个 Web 地址。如果 Web 地址返回一个 GRML 网页，Web 浏览器将读取并显示“工作区”窗口中的 Web 应用程序描述。

一旦“工作区”窗口中列出了可用的 Web 应用程序，用户就可以通过在 Web 浏览器中打开一个窗口（例如：Ctrl+N）来创建 Web 应用程序。要使用 Web 应用程序，只需使用输入控件输入请求并按“Enter”键。任何结果都将出现在“结果”窗口中。可以创建许多类型的 Web 应用程序，例如搜索引擎、图片库或新闻头条。

好的，现在我们知道了 GRML Web 浏览器是什么样的，让我们来看看 GRML 文档是什么。

GordonRhodes 标记语言 (GRML)

GordonRhodes 标记语言是一种数据描述和显示标记语言。它具有类似于 HTML 的标签。与 HTML 不同，它不指定格式、布局和定位，例如框架、表格、大小、字体或颜色。相反，GRML 定义了数据类型和关系。GRML Web 浏览器决定如何显示和格式化它（最终决定权在于您）。然而，与 HTML 一样，它确实显示了不同类型的数据，例如文本、超链接和图像。

以下 GRML 网页创建了前面显示的“工作区”窗口。Pioneer 使用它来描述您可以从 *sevenmilesearch.com* 创建哪些类型的数据窗口。

<GRML>
<a class=navi_13 type=sitedetails>Welcome to the SevenMileSearch web</>
<a class=navi_13 type=sitedetails>site. There are currently 5 web</>
<a class=navi_13 type=sitedetails>applications available. When you open</>
<a class=navi_13 type=sitedetails>a web application, the directions to</>
<a class=navi_13 type=sitedetails>use it will appear in this window.</>
<a class=navi_13 type=sitedetails></>
<a class=navi_13 type=sitedetails></>
<a class=navi_13 type=sitedetails>If you have any questions or comments</>
<a class=navi_13 type=sitedetails>about this web site and the web applications</>
<a class=navi_13 type=sitedetails>here, send an email to: sevenmilesearch@yahoo.com</>
<a class=navi_13 Name=AUCT type=location>sevenmilesearch.com/auc.asp</>
<a class=navi_13 Name=AUCT type=Icon>6</>
<a class=navi_13 Name=AUCT type=title>Auctions</>
<a class=navi_13 Name=AUCT type=description>This application only works with</>
<a class=navi_13 Name=AUCT type=description>EBay, currently. To submit a request,</>
<a class=navi_13 Name=AUCT type=description>enter the search terms in the edit</>
<a class=navi_13 Name=AUCT type=description>box and press 'Enter'.</>
<a class=navi_13 Name=AUCT type=description></>
<a class=navi_13 Name=AUCT type=description></>
<a class=navi_13 Name=AUCT type=description>Images are supported.</>
<a class=navi_13 Name=HDLN type=location>sevenmilesearch.com/headlines.asp</>
<a class=navi_13 Name=HDLN type=title>Headlines</>
<a class=navi_13 Name=JOBS type=location>sevenmilesearch.com/jobs.asp</>
<a class=navi_13 Name=JOBS type=title>Job Search</>
<a class=navi_13 Name=SRCH type=location>sevenmilesearch.com/images.asp</>
<a class=navi_13 Name=SRCH type=title>Images Only</>
<a class=navi_13 Name=TEST1 type=location>sevenmilesearch.com/links.asp</>
<a class=navi_13 Name=TEST1 type=title>Links Only</>
<a class=navi_13 Name=TEST2 type=location>sevenmilesearch.com/translate.asp</>
<a class=navi_13 Name=TEST2 type=title>Images & Links</>
</GRML>

让我们看看上面网页中包含的内容。首先，有一行是 <GRML>。这表示 GRML 文档的开始。当首次遇到此标记时，Web 浏览器将查找它可以读取以填充其窗口的数据。要标记 GRML 文档的结束，请使用 </GRML> 来告诉 Web 浏览器停止查找数据。

在 GRML 中，只有一种类型的标签，一种标签对。所有标签都以 <a ...> 开头，以 </> 结尾。

<a ...> 包含三个属性：class、name 和 type。class 和 type 属性是必需的，而 name 是可选的。此外，每个标签都包含一个值，该值指定在标签对之间。例如，以下标签对的值：

<a class=navi_13 Name=JOBS type=title>Job Search</>

是“职位搜索”。

现在让我们看看 <a ...> 标签的每个属性。

“Class”属性

Pioneer 在标签中首先查找的是 class 属性。此属性标识应接收数据的窗口。这就是 GRML 告诉 Web 浏览器数据应显示在何处的方式。上述文档仅识别“工作区”窗口的内容，该窗口显示用户当前可用的文件、网页、Web 应用程序和网站。

Pioneer (v3.05) 支持 class 属性的六种可能选项：

• navi_13 (工作区窗口)
• edit_13（编辑控件，**数据窗口** *输入表单*）
• combo_13（组合框控件，**数据窗口** *输入表单*）
• dynamic_13（“特殊”组合框控件，**数据窗口** *输入表单*）
• column_13（列控件，**数据窗口** *结果区域*）
• rslt_13（显示控件，**数据窗口** *结果区域*）

“Name”属性

此属性是可选的，取决于 class 属性中标识的窗口。例如，“工作区”窗口需要 name 属性。**数据窗口** 的 *输入表单* 需要一个“name”以便将名称-值对发送到网站。**数据窗口** 的 *结果区域* 仅在 *输入表单* 中存在“dynamic”控件时才使用 name 属性。name 用于区分 *结果区域* 的不同结果集。

“Type”属性

每个标签对都需要一个 type 属性。这标识了标签对值的类型。

在 Pioneer (v3.05) 中，它们是：

• location；title；description；sitedetails

  navi_13 (工作区窗口)。

• keyword；bgtext；text；title

  edit_13 (数据窗口 *输入表单*)。

• item；title

  combo_13 (数据窗口 *输入表单*)。

• item；title

  dynamic_13 (数据窗口 *输入表单*)。

• title；width

  column_13 (数据窗口 *结果区域*)。

• image；item；link

  rslt_13 (数据窗口 *结果区域*)。

上述 GRML 网页是静态的。换句话说，创建网页不需要服务器端处理。在下一节中，将使用 ASP 动态创建 GRML 网页。这演示了如何使用 ASP 和 Perl 进行服务器端处理来处理用户请求。

动态创建 Web 应用程序的 GRML 网页

好的，现在我们了解了一些关于 GRML、GRML 网页和 GRML Web 浏览器（Pioneer）的基础知识。GRML 标签的基本内容已经介绍完毕。现在，是时候看看如何创建处理用户输入并显示结果的网页了。

动态创建 GRML 网页与仅仅描述静态属性略有不同。网页必须提供输入控件供用户提交请求，并且必须创建逻辑来检索他们想要的结果。这不需要学习任何新标签，但需要理解如何使用标签来创建控件和显示结果。这也意味着 GRML 网页将不再是静态的，而是将 **需要** 服务器端处理来动态生成 GRML。

有三种不同的方法可以创建 GRML 网页。一种方法是从数据库检索数据。另一种方法是从非数据库源（例如，平面文件、电子表格或自定义数据文件）检索数据。第三种方法是通过创建 HTML 和 GRML 之间的适配器来从另一个网站检索数据。

本文仅讨论第三种选择，即创建“适配器”来将 HTML 转换为 GRML。

“职位搜索”

查看上面的屏幕截图，您可以看到来自 *sevenmilesearch.com/jobs.asp* 的职位搜索界面。从 *jobs.asp* 创建的数据窗口允许四种视图（上面只显示了报表），可以通过右键单击数据窗口并选择视图来选择。上面的屏幕截图显示了“java la”请求的结果。要为网站创建类似这样的职位搜索，需要服务器端处理，例如 ASP、JSP、ISAPI、PHP 或 CGI。这个特定的 Web 应用程序是用 ASP 和 Perl 编写的。

创建职位搜索需要一个支持服务器端处理的 Web 服务器。在这种情况下，IIS 与 Perl 一起使用，因为它具有出色的文本处理语言。然而，任何支持正则表达式的语言都应该可以工作（例如 .NET）。

好的，我们开始吧。下面是（截至 2004 年 1 月 4 日）从 *jobs.asp* 生成的 GRML：

（注意：职位搜索在报表视图中有一个“链接位置”列，用于显示超链接位置。此外，如果属性是 `rslt_13` ` class` 的 `image` `type`，则在报表视图中会添加一个“图片位置”列。）

<GRML>
<a class=edit_13 type=keyword>monster:</>
<a class=edit_13 type=Title>Request:</>
<a class=edit_13 type=bgText>Enter location and job keywords</>
<a class=Combo_13 Name=Default type=Title>Default location</>
<a class=Combo_13 Name=Default type=Item>monster <default></>

edit_13 和 combo_13 ` class` 各有自己的名称，因此职位搜索可以从每个控件检索用户输入。

职位搜索的 *输入表单* 如下所示：

<a class=column_13 type=Item>Date Posted</>
<a class=column_13 type=Width>75</>
<a class=column_13 type=Item>Job Title</>
<a class=column_13 type=Width>150</>
<a class=column_13 type=Item>Job Location</>
<a class=column_13 type=Width>150</>
<a class=column_13 type=Item>Company</>
<a class=column_13 type=Width>150</>
<a class=column_13 type=Item>Search</>
<a class=column_13 type=Width>75</>
<a class=column_13 type=Item>DateTime</>
<a class=column_13 type=Width>100</>

column_13 ` class` 在职位搜索（报表视图）中显示以下内容：

“链接位置”列（未在上图显示）会自动添加。

以下 GRML 创建了职位搜索请求“java la”的 **数据窗口** *结果区域* 的结果。它不列出所有结果，只显示前 3 个。

<a class=rslt_13 type=Item>Nov 11</>
<a class=rslt_13 type=Item>Sr. Java / J2EE Architect Needed in LA</>
<a class=rslt_13 type=Item>US-CA-Los Angeles & Orange County</>
<a class=rslt_13 type=Item>Zion Partners</>
<a class=rslt_13 type=Item> 1:java la </>
<a class=rslt_13 type=Item>1/4/2001 5:58:19 PM</>
<a class=rslt_13 type=link>jobsearch.monster.com/getjob.asp?q=java+la</>

<a class=rslt_13 type=Item>Dec 5</>
<a class=rslt_13 type=Item>Bright mid-level Java, JSP engineer needed!</>
<a class=rslt_13 type=Item>US-CA-Carson</>
<a class=rslt_13 type=Item>Remington International</>
<a class=rslt_13 type=Item> 1:java la </>
<a class=rslt_13 type=Item>1/4/2001 5:58:19 PM</>
<a class=rslt_13 type=link>jobsearch.monster.com/getjob.asp?q=java+la</>

<a class=rslt_13 type=Item>Dec 8</>
<a class=rslt_13 type=Item>LA Financial Co. seeks a .NET programmer</>
<a class=rslt_13 type=Item>US-CA-Los Angeles</>
<a class=rslt_13 type=Item>Atlantis Partners</>
<a class=rslt_13 type=Item> 1:java la </>
<a class=rslt_13 type=Item>1/4/2001 5:58:19 PM</>
<a class=rslt_13 type=link>jobsearch.monster.com/getjob.asp?q=java+la</>

rslt_13 ` class` 在职位搜索中显示如下：

当 Web 浏览器读取 GRML 时，它会解析每一行，并尝试将标签对的值放在标签属性指示的位置。当 Web 浏览器解析 ` class` 属性并找到 `edit_13`、`combo_13` 或 `dynamic_13` 时，它会尝试创建 **数据窗口** 的 *输入表单*。当它读取 `column_13` 或 `rslt_13` 以及具有 `item` 属性的 `type` 属性时，它开始创建 **数据窗口** 的 *结果区域*。通过按遇到的顺序插入 `rslt_13` 标签对来添加结果。因此，为 `rslt_13` 标签对读取的第三个项目，放置在第三列。如果没有第三列，Web 浏览器会添加一个新结果。

现在我们已经看到了职位搜索 *结果区域* 的 GRML，您现在可以查看创建此网页的 ASP 了。

“示例 Web 应用程序”下载中包含的服务器端脚本使用 PerlScript 和 VBScript，需要 IIS。要查看生成上述 GRML 的脚本，请查看 *jobs.asp* 文件。事实上，将其加载到您的服务器上并提交一些请求。为了使其正常工作，您需要下载 ActiveState 的 ActivePerl 模块。或者，如果您有兴趣，也可以将其移植到 .NET。

由于 Perl 具有出色的文本处理功能，因此大部分解析都是使用它完成的。但是，VBScript 具有一些方便的函数，这些函数是必需的，因此它们包含在 *vbperl.inc* 文件中。

如果您不精通 Perl，那么服务器端脚本可以用您选择的工具编写。因为这是一个需要解析 HTML 的“适配器”类型的 Web 应用程序，所以 Perl 被证明非常强大。

结论

好了，就这样。您现在应该对 GordonRhodes 环境、GordonRhodes 标记语言、Pioneer Web 浏览器以及动态生成 GRML 网页有了基本了解。您了解了构成 Pioneer 用户界面的基本窗口以及如何提交请求和查看结果。您知道有三种方法可以创建处理用户请求的网页：使用数据库、使用非数据库源或使用其他网站。在这一切之后，您现在应该比开始时对 GRML 有了更多的了解。

在下一篇文章中，将讨论 GRML 的其他方面。例如，如何创建非数据库和非适配器 Web 应用程序？或者，如何将 GRML 和 HTML 合并到一个网页中？还将介绍其他 Web 应用程序，例如搜索引擎、图片库，甚至 RSS。此外，还将进一步探索和解释 Web 浏览器界面，以演示导航、文件处理和其他显示选项。

要熟练使用这些技术，需要理解许多概念。事实上，可能需要一本书才能讨论它的每一个方面。请记住，没有人会一夜之间成为专家。

关注点

• Pioneer 只读取 GRML 网页。
• GRML 只有一个标签，即 <a ...> 标签。
• 如果 <a ...> 标签未关闭，Web 浏览器将忽略它。
• GRML 中的所有标签都是成对的。有一个开标签 <a ...> 和一个闭标签 ... </>。
• 每个标签对必须在同一行上，否则 Web 浏览器将忽略它。
• 标签对中有 3 个属性 - class、name 和 type。
• 标签对始终有一个值，即使它为空。
• 所有标签都必须指定 class 和 type 属性。
• GRML 网页以 <GRML> 开头，以 </GRML> 结尾。
• 您可以通过使用 <-- 和 --> 标签注释掉 GRML 来将 GRML 网页与 HTML 网页结合起来。

相关的 GRML 文章

• HTML、XML、RML - 制作更好的 Web 标记语言.
• 一个适用于 Windows 和 ASP 的简单网页格式.

历史

• 1/5/04
  • 重写了文章，重点关注职位搜索和拍卖。
  • 描述了 Pioneer 用户界面。
  • 更改了示例图片。
  • 从文章中删除了 PerlScript。
  • 新术语描述和使用更加一致。
• 6/9/03
  • 将文章的重点从 RML 更改为 GRML。
  • 更新了 Pioneer 下载。更新了图片。
  • 更新了文章内容，以反映 Pioneer 读取和显示 GRML 的改进功能。
• 1/20/03
  • 在许多地方更新了文本，使其更加一致和清晰。
• 2003 年 1 月 9 日 - 文章的第一个版本。
  • “天气”Web 应用程序、Rhodes Web Framework、RML、Pioneer。