回到以往的好日子,那時的HTML標準還是一個移動中的目標,無論您正確地結束了<p>標簽或者讓您的格式規則與樣式代碼相分離都不會造成麻煩。不匹配的標簽、丟失的屬性、糟糕的嵌套元素--缺乏廣泛采用的標準造成了這些和其他的錯誤,但因為大部分瀏覽器都內建了智能功能來避免這些錯誤,所以大部分開發者也根本不會覺察到它們的存在。
盡管瀏覽器自身在盡量修正這些錯誤,但是,這并不是您可以忽略這些問題的理由。為了讓您的網頁在所有的瀏覽器中表現一致,您的HTML必需與W3C 標準中界定的規則和語法完全一致,有很多工具可以實現這一需求,有在線的也有離線的,這篇文章將討論它們中的一個:非常酷的HTML Tidy。
HTML Tidy是一個免費的HTML檢查工具,它是設計用來檢查您的HTML代碼,并可以指出其中沒有完全符合W3C發布標準的地方,它可以用來分析一個HTML文件或者一個包含HTML語句的字符串,還可以自動進行必需的修改以使代碼符合相關標準的要求。
安裝
HTML Tidy是免費的,它可以運行在Windows,Macintosh和*NIX平臺上,有二進制版本可供直接使用,如果您運行的是*NIX平臺,那您可能更希望親自從源代碼進行編譯和安裝,可以這樣操作:將源文件抽取到您的臨時文件夾并執行基本的編譯-安裝過程,如下所示:
shell> cd /tmp/tidy/build/gmake
shell> make
shell> make install
當這一過程結束的時候,您應該可以在/tmp/tidy/bin/tidy文件夾中找到一個編譯好了的Tidy的二進制版本,將這個文件拷貝到您的系統文件夾/usr/local/bin/中,這樣就更易于訪問了。現在您已經準備好使用這個工具了。
基本用法
一旦安裝了二進制版本,您馬上就可以開始使用它來檢驗HTML代碼,列表A展示了一個簡單的例子:
列表A:
shell> tidy -e -q index.html
line 1 column 1 - Warning: missing <!DOCTYPE> declaration
line 2 column 1 - Warning: inserting missing 'title' element
line 4 column 1 - Warning: <body> proprietary attribute "leftmargin"
line 6 column 1 - Warning: <table> proprietary attribute "height"
line 6 column 1 - Warning: <table> lacks "summary" attribute
line 11 column 37 - Warning: <img> lacks "alt" attribute
line 15 column 1 - Warning: <table> lacks "summary" attribute
line 17 column 50 - Warning: <img> lacks "alt" attribute
在這個例子中,Tidy發現了文件中八個潛在的錯誤,并為每個錯誤打印出了一個警告,注意,這些錯誤并不是嚴重錯誤,只是警告代碼中的某些部分并不是非常正確。
您可以通過在命令行中添加-m(修飾符)這個選項來實現自動修正原始文件:
shell> tidy -m -q index.html
如果您需要測試一個很大的網站,可以使用命令行中的通配符來測試一個文件夾中的所有文件(而不是僅僅一個):
shell> tidy -m -q *.html
如果您希望那個Tidy幫助寫出修正過的網頁到一個新的文件(而不是覆蓋原有的),那就在使用-output選項和新的文件名,如下例所示:
shell> tidy -output index.html.new -q index.html
您可以通過-e(“錯誤”)選項將所有的錯誤輸出到一個單獨的日志文件供以后查看:
shell> tidy -f error.log index.html
另外要注意,如果您的HTML代碼中含有內嵌的PHP,ASP或JSP代碼,Tidy會簡單地忽略它們并將它們留在適當的位置,這意味著您甚至可以在服務器端腳本上運行Tidy工具,來檢驗其中的HTML代碼部分,這是一個例子:
shell> tidy -e -q processor.php
您還可以以交互方式運行Tidy工具,只調用程序文件,而不附加任何參數,在這個例子中,Tidy等待控制臺的輸入并檢查其錯誤,列表B展示了這樣一個例子:
列表B
shell> tidy
<html>
line 1 column 1 - Warning: missing <!DOCTYPE> declaration
<head>
<title>This is a test
</head>
line 3 column 1 - Warning: missing </title> before </head>
<body leftmargin=0>
<p>
This is a badly terminated paragraph
</body>
</html>
line 5 column 1 - Warning: <body> proprietary attribute "leftmargin"
Info: Document content looks like HTML Proprietary
3 warnings, 0 errors were found!
注意,除了給您實時的錯誤警告之外,Tidy還可以在輸入結束的時候打印出正確版本的代碼:
<html>
<head>
<meta name="generator" content=
"HTML Tidy for Linux/x86 (vers 1 September 2005), see www.w3.org">
<title>This is a test</title>
</head>
<body leftmargin="0">
<p>This is a badly terminated paragraph</p>
</body>
</html>
高級應用
您還可以控制Tidy對一個文件修改的方式,這可以通過在命令行傳遞特定的參數來實現,例如,讓Tidy來重新對代碼進行正確的縮進,可以添加-i(“縮進”)選項:
shell> tidy -output new.html -i index.html
替換<font>和其他與CSS樣式規則相關的格式元素,可以使用-c(“清除”)選項:
shell> tidy -output new.html -c index.html
在默認情況下,Tidy對HTML文件中所有的標簽和屬性都使用小寫字母,如果您希望使用大寫字母,可以添加-u(“大寫字母”)選項,如下例所示:
shell> tidy -output new.html -c -u index.html
使文字在特定的行寬進行換行,可以添加-w(“換行”)選項與指定的行寬,如下例所示:
shell> tidy -output new.html -w 40 index.html
您可以通過添加-asxhtml選項來將一個HTML文檔轉換為格式良好的(well-formed)XHTML文檔:
shell> tidy -output new.html -asxhtml index.html
通過-ashtml選項可以進行反向操作:
shell> tidy -output new.html -ashtml index.html
如果您需要對Tidy的默認選項進行大量調整,那么最好將這些選項放在一個單獨的配置文件中,您可以在每次調用程序的時候進行參考,列表C展示了一個配置文件的例子:
列表C:
bare: yes # remove proprietary HTML
doctype: auto # set the doctype
drop-empty-paras: yes # automatically delete empty <p> tags
fix-backslash: yes # replace by / in URLs
literal-attributes: yes # retain whitespace in attribute values
lower-literals: yes # convert attribute values to lower case
output-xhtml: yes # produce valid XHTML output
quote-ampersand: yes # replace & with &
quote-marks: yes # replace " with "
repeated-attributes: keep-last # use the last of duplicated attributes
indent: yes # automatically indent code
indent-spaces: 2 # number of spaces to indent by
wrap-php: no # wrap text contained in PHP tags
char-encoding: ascii # character encoding to use
tidy-mark: no # omit Tidy meta information in corrected code
當整理一個文件的時候,可以通過在命令行中添加-config選項來告訴Tidy使用這些設置:
shell> tidy -output a.html -configconfig.tidy index.html
您可以通過-help-config選項來獲取一個配置選項的列表:
shell> tidy -help-config...quote-ampersand Boolean y/n,
yes/no, t/f, true/false, 1/0quote-marks Boolean y/n,
yes/no, t/f, true/false, 1/0quote-nbsp Boolean y/n,
yes/no, t/f, true/false, 1/0repeated-attributesenum keep-first,
keep-lastreplace-color Boolean y/n, yes/no,
t/f, true/false, 1/0show-body-only Boolean y/n,
yes/no, t/f, true/false, 1/0...
或者使用-show-config選項來查看當前配置設定的快照(snapshot):
shell> tidy -show-config...show-body-only
Boolean noshow-errors Integer
6show-warnings Boolean yesslide-style
Stringsplit Boolean no...
最后,您可以使用-h選項來獲得命令行的幫助:
shell> tidy -h
目前,這就是所有的功能了,希望您會發現Tidy在輔助您的網站達到完全符合W3C發布標準方面是一個非常有價值的工具,這篇指南所介紹的要點可以讓您了解如何控制HTML Tidy工具來操作您的代碼,同時也會幫助您更有效率地使用這個工具。
新聞熱點
疑難解答