Ajax基础教程(5)- 5.2 使用Firefox扩展验证HTML内容

5.2 使用Firefox扩展验证HTML内容

当前的浏览器都能很好地实现W3C DOM标准。只要创建的内容能遵循标准HTML或XHTML,就几乎能得到所有浏览器的支持。

不过通常说起来简单,做起来就不那么容易了。不同于C++或Java这样的编译语言,HTML没有编译器可以将人可读的代码翻译为机器可读的二进制代码,要由Web浏览器将人可读的HTML或XHTML代码解释成DOM的内部表示,并适当地将这个内容展现在屏幕上。

20世纪90年代末,浏览器之争使得浏览器开发商(如Microsoft和Netscape)纷纷增加了一些专用的HTML标记,以扩大自己的市场份额。出于这个原因,再加上HTML没有严格的编译器,这就导致了大量非标准Web页面的出现。当前的浏览器尽管支持最新的W3C标准,不过也会尽可能地“通融”写得不好的HTML页面。根据HTML页面的doctype(如果有的话),大多数浏览器都有两种呈现模式:strict(严格)和quirks(怪异)。当doctype指示Web页面应遵循某个W3C推荐规约(如HTML 4.1或XHTML 1.0)编写时,Web浏览器就会使用strict模式;当没有doctype,或者页面与指定的doctype有很多冲突时,Web浏览器就使用quirks模式。

作为一名开发人员,应当尽力创建遵循某种W3C标准的页面。这么做不仅使你的Web页面在所有现代Web浏览器上可访问,而且由于浏览器可以根据HTML代码创建准确的DOM表示,这也能让你的日子更好过。如果页面写得不好,浏览器可能无法创建DOM的准确表示,就会使用quirks模式来呈现页面。DOM表示不正确,就很难通过JavaScript来访问和修改,特别是无法以跨浏览器的方式来访问。

由于HTML没有严格的编译器,怎么确保你写的HTML代码遵循W3C标准呢?幸运的是,Firefox Web浏览器已经有几个扩展,可以很容易地验证你的Web页面。

5.2.1 HTML Validator

HTML Validator[1]是一个Firefox扩展,它能查找并标志出HTML页面上的错误。HTML Validator以Tidy为基础,Tidy最初是W3C为验证HTML代码开发的一个工具。HTML Validator把Tidy工具嵌入在Firefox中,这样就能在浏览器中验证页面的源代码,而不必把代码发给第三方进行验证。

Tidy会查找HTML错误,并把这些错误归为3类:

l  错误(error):Tidy无法修正或理解的问题。

l  警告(warning):Tidy可以自动修正的错误。

l  可访问性警告(accessibility warning):这些HTML警告对应W3C Web可访问性计划(Web Accessibility Initiative,WAI)定义的3个优先级。


HTML Validator在浏览器的右下角显示页面的状态以及错误个数,从而能在开发周期中提供很快的反馈(见图5-2)。

如果选择View→Page Source菜单项查看Web页面的源代码,HTML Validator还能提供更多的帮助。Firefox的view-source(查看源代码)窗口会正常打开,不过还将启用HTML Validator,这个窗口中包括两个新的窗格(见图5-3)。HTML Errors and Warnings(HTML错误和警告)窗格列出在页面中找到的所有错误。点击列表中的任何错误项,源代码主窗口就会显示HTML源代码中有问题的代码行。Help(帮助)窗格详细描述了这个问题,并提供一些修正这个问题的建议。

Firefox的view-source窗口的底部包括一个Clean up the Page(清理页面)按钮。点击这个按钮后将打开一个窗口,这个窗口中显示的内容能进一步帮助你修正页面上的错误(见图5-4)。Clean up the Page窗口打开后,窗口的最上面有4个标签:Cleaned Html(清理后的HTML)、Original Html(原来的HTML)、Cleaned Browser(清理后的浏览器)和Original Browser(原来的浏览器)。


图5-3 当查看页面的源代码时,HTML Validator会列出HTML源代码中的错误,并提出修正问题的建议


图5-4 HTML Validator 的Cleanup the Page对话框给出了新的源代码,这个源代码已经修正了在原来的源HTML代码中发现的错误

Cleaned Html标签对Web开发人员最有用。这个标签列出了通过HTML Validator进行修正后的页面源代码。HTML Validator会尽其所能自动修正页面上的所有错误,修正后的输出就列在这个标签下。Original Html标签列出了页面原来的源代码,也就是在HTML Validator处理之前的形式。

有时,修正页面上的HTML错误可能会改变浏览器呈现页面的方式,这可能是我们需要的,也可能不是我们希望的。Cleaned Browser标签显示了使用HTML Validator提供的已修正源代码后,页面会是什么样子,而Original Browser标签则显示使用原来的源代码时相应的页面。

总之,HTML Validator是一个强大的工具,可以帮助你清理HTML,使之遵循W3C标准和推荐规约。遗憾的是,HTML Validator只能在Windows平台上使用。好在,还有另一个与HTML Validator有类似功能的Firefox扩展,而且在所有平台上都可以使用。

时间: 2024-08-30 07:39:57

Ajax基础教程(5)- 5.2 使用Firefox扩展验证HTML内容的相关文章

Ajax基础教程(5)- 5.6 使用Firefox的Web开发扩展

Firefox的Web开发扩展为Firefox浏览器增加了大量有用的Web开发工具.一旦安装了这个扩展,你就可以通过一个工具条来访问为浏览器增加的这些工具(见图5-14).在目前能够运行Firefox的所有平台上都能使用这个扩展包,这就意味着在Windows.OS X和Linux都能顺利地使用这个扩展包.Firefox的Web开发扩展包可以从chrispederick.com/ work/firefox/webdeveloper/获得. 图5-14 Web开发扩展为Firefox增加的工具条 W

AJAX基础教程及初步使用

ajax|基础教程 Ajax基础教程 什么是 AJAX? AJAX (异步 JavaScript 和 XML) 是个新产生的术语,专为描述JavaScript的两项强大性能.这两项性能在多年来一直被网络开发者所忽略,直到最近Gmail, Google suggest和google Maps的横空出世才使人们开始意识到其重要性. 这两项被忽视的性能是: 无需重新装载整个页面便能向服务器发送请求. 对XML文档的解析和处理. 步骤 1 – "请!" --- 如何发送一个HTTP请求 为了用

技术新知:AJAX基础教程

ajax|基础教程     什么是 AJAX? AJAX (异步 JavaScript 和 XML) 是个新产生的术语,专为描述JavaScript的两项强大性能.这两项性能在多年来一直被网络开发者所忽略,直到最近Gmail, Google suggest和google Maps的横空出世才使人们开始意识到其重要性. 这两项被忽视的性能是:     * 无需重新装载整个页面便能向服务器发送请求.    * 对XML文档的解析和处理. 步骤 1 – "请!" --- 如何发送一个HTTP

Ajax与《Ajax基础教程》

ajax|基础教程 <Ajax基础教程>是国际上第一部有关Ajax的图书.其中文版也是国内首部Ajax图书,即将由人民邮电出版社推出. <Ajax基础教程>图灵程序设计丛书 (美)Ryan Asleson Nathaniel T.Schutta著金灵等译 人民邮电出版社2006年1月 定价:35元 Ajax,Ajax,Ajax!请不要弄错了,我说的不是希腊史诗中的英雄,也不是那支享誉全球的梦幻荷兰足球俱乐部,更不是加拿大的某个地名.去问问身边的技术追新族,他会一脸不屑地告诉你:连A

Ajax基础教程

ajax|基础教程 AJAX (异步 JavaScript 和 XML) 是个新产生的术语,专为描述JavaScript的两项强大性能.这两项性能在多年来一直被网络开发者所忽略,直到最近Gmail, Google suggest和google Maps的横空出世才使人们开始意识到其重要性.  这两项被忽视的性能是:  • 无需重新装载整个页面便能向服务器发送请求.  • 对XML文档的解析和处理. 步骤 1 – "请!" --- 如何发送一个HTTP请求 为了用JavaScript向服

Ajax基础教程(5)- 构建完备的Ajax开发工具箱 5.7 小结

本章我们介绍了一些工具和技术,采用这些工具和技术,会让你的开发过程更加愉快.JSDoc可以帮助建立JavaScript代码的文档,从而使其他开发人员能够更容易地理解和使用代码.如果你开始经常使用Ajax技术,肯定会编写一些你自己可重用的JavaScript库,而且会用JSDoc为代码建立文档,以便其他人更轻松地使用这些库. HTML Validator和Checky等工具可以帮助你确保所写的HTML代码是合法的HTML.不合法的HTML会导致未预见的行为,所以使用合法的HTML或XHTML能消除

Ajax基础教程(5)- 5.3 使用DOM Inspector搜索节点

3 使用DOM Inspector搜索节点 在Mozilla Suite和Firefox浏览器中打包了一个DOM Inspector工具.如果利用DOM Inspector,则可以查看Web页面的结构化表示,甚至能搜索某些特定的节点,并自动更新DOM中的节点.在Firefox中,你可以通过Tools菜单项来访问DOM Inspector.要使用DOM Inspector来检查一个Web页面,需要在文本框中输入所需的URL,并点击Inspect框:或者也可以从File→Inspect a Wind

Ajax基础教程(2)-使用XMLHttpRequest对象 2.1 概述

在使用XMLHttpRequest对象发送请求和处理响应之前,必须先用JavaScript创建一个XMLHttpRequest对象.由于XMLHttpRequest不是一个W3C标准,所以可以采用多种方法使用JavaScript来创建XMLHttpRequest的实例.Internet Explorer把XMLHttpRequest实现为一个ActiveX对象,其他浏览器(如Firefox.Safari和Opera)把它实现为一个本地JavaScript对象.由于存在这些差别,JavaScrip

Ajax基础教程(1)-Ajax简介 1.2 浏览器历史

提到Web浏览器,大多数人都会想到无处不在的Microsoft Internet Explorer,直到最近像Firefox.Safari和Opera之类的浏览器日益兴起,这种情况才稍有改观.许多新手可能会误认为IE是市场上的第一个浏览器,其实不然.实际上,第一个Web浏览器出自Berners-Lee之手,这是他为NeXT计算机创建的(这个Web浏览器原来取名叫WorldWideWeb,后来改名为Nexus),并在1990年发布给CERN的人员使用.Berners-Lee和Jean-Franco