超文本鏈接指針是html最吸引人們優點之一。使用超文本鏈接指針可以使順序存放的文件具有一定程度上隨機訪問的能力,這更加符合人類的思維方式。人的思維是跳躍的、交叉的,而每一個鏈接指針正好代表了作者或者讀者的思維跳躍。因而組織得好的鏈接指針不僅能使讀者跳過他不感興趣的章節(比如一些枯燥的數據),而且有助於更好地理解作者的意圖。
一個超文本鏈接指針由兩部分組成。一是被指向的目標,它可以是同一文件的另一部分,也可以是世界另一端的一個文件,還可以是動畫或音樂;另一部分是指向目標的鏈接指針。
§3.1 統一資源定位器URL統一資源定位器(uuiform Resource
Locator)是文件名的擴展。在單機系統中,定位一個文件需要路徑和文件
名,對於遍布全球的Internet網,顯然還需要知道文件存放在哪個網絡的哪台主機中才行。與單機系統不一樣的是在單機系統中,所有的文件都由統一的操作系統管理,因而不必給出訪問該文件的方法;而在Internet上,各個網絡,各台主機的操作系統都不一樣,因此必須指定訪問該文件的方法。一個URL包括了以上所有的信息。它的構成為:
protocol://
machine.name[:port]/directory/filename其中protocol是訪問該資源所采用的協議,即訪問該資源的方法,它可以是:
http
超文本傳輸協議,該資源是html文件
file 文件傳輸協議,用ftp訪問該資源
ftp 文件傳輸協議,用ftp訪問該資源
gopher gopher協議,該資源是gopher文件
news 表明該資源是網絡新聞
madcine.name 是存放該資源主機的IP 地址,通常以字符形式出現,如 sun.ihep.ac.cn
port端口號,是服務器在該主機所使用的端口號。一般情況下端口號不需要指定。
只有當服務器所使用的端口號不是缺省的端口號時才指定。
directory和filename是該資源的路徑和文件名。
一個典型的URL為http://www.ihep.ac.cn 它表示中科院高能所WWW服務器上的起始html文件。(文件具體存放的路徑及文件名取決於該WWW服務器的配置情況)。
與單機系統絕對路徑,相對路徑的概念類似,統一資源定位器也有絕對URL和相對URL之分。上文所述的是絕對URL。相對URL是相對於你最近訪問的URL。比如你正在觀看一個URL為http://www.inep.ac.cn/index.html的文件,如果想看同一個目錄下的另一個文件china.html,你可以直接使用china.html,這時china.html就是一個相對url,它的絕對url為http://www.ihep.ac.cn/china.html
§3.2 指向一個目標<a>
在html文件中用鏈接指針指向一個目標。其基本格式為:<a
href="url">字符串</a>href屬性中的統一資源定位器(url)是被指向的目標,隨後的“字符串”在html文件中充當指針的角色,
它一般顯示為藍色。當讀者用鼠標點這個字符串時,浏覽器就會將url處的資源顯示在屏幕上。例如:
<a
href="http://www:ihep.ac.cn">IHEP CHINA homepage</a>用戶用鼠標點取IHEP china
homepage,即可看到高能所編寫的關於中國情況的介紹。在這個例子中, 充當指針的是IHEP china
homepage,下面我們將看到用圖象做為指針的例子。
在編寫html文件時,需要知道目標的url。如何才能得到目標的url呢?對於自己主機內的文件,它的url
可以根據該文件的實際情況決定。對於Interner上的資源,
我們在用浏覽器觀看時,它的url會在浏覽器的Location一欄中顯示出來,把它抄下來寫到你的html文件中即可。
在編寫html文件時,對有能確定關系的一組資源(比如在同一個目錄中)應采用相對url,
這不僅簡化你的html文件,而且便於維護。比如當你需要將某個目錄整個搬到另外一個地方或把某一主機的資源移到另一台主機時,用相對url寫的html文件用不看更新其中的url(只要它們的相對關系沒有改變)。但如果你用絕對url編寫html,你就不得不逐字修改每個鏈接指針中的url,這是一件很乏味也很容易出錯的工作。對於各個資源之間沒有固定的關系,比如你的html文件是介紹各大學情況的,它所指向的目標分布在全球的主機中,這時你就只能用絕對url了。
在本章的末尾,作者給出一個完整的html文件,該文件使用了前三章介紹的全部元素,以便於讀者理解。
§3.3
標記一個目標
上節提到的鏈接指針可以使讀者在整個Interner網上方便地鏈接。但如果你編寫了一個很長的html文件,從頭到尾地讀很浪費時間,能不能在同一文件的不同部分之間也建立起鏈接,使用戶方便地在上下方之間跳轉呢?答案是肯定的。前面曾提到過一個超文本鏈接指針包括兩個部分,一個指向目標的鏈接指針,另一個是被指向的目標。對於一個完整的文件,我們可以用它的url來唯一地標識它,
但對於同一文件的不同部分,我們怎樣來標識呢?下面的內容將介紹鏈接指針元素的另外的一個用途,標識目標。
標識一個目標的方法為:
<a
name="name">text</a>
name屬性將放置該標記的地方標記為“name”,name是一個全文唯一的標記串,text部分可有可無。這樣,我們就把放置標記的地方做了一個叫做“name”的標記。
做好標記後,可以用下列方法來指向它,<a
href="url#name">text </a>url是放置標記的html文件的url
name是標記名,對於同一個
文件,可以寫為 <a href="#name">text
</a>這時就可以點取text跳轉到標記名為name的部分了。
§3.4 目標窗口
如果希望被指向的目標在一個新的窗口中顯示,可以使用target屬性來修飾鏈接指針元素。
<a href="url"
target="window-name">text
</a>將url代表的資源顯示在一個新的窗口中,該窗口的名字叫window-name。
注意:僅用於Netscape2.0浏覽器。
§3.5 圖象鏈接指針圖象也可以做為鏈接指針。格式為:<a href="url"><img
src="url"></a>可以看出,上例中用<img
src="url">取代了鏈接指針中text的位置。
<img
src="url">是圖象元素,它表明顯示url代表的圖象文件,參見圖象一章。
下面是一個簡單的圖象鏈接指針。
<a
href="www.ihep.ac.cn">China home page<img
src=/uploadfile/2015/0521/20150521023552671.gif"></a>
§3.6
圖象地圖(image map)
上一節介紹的圖象鏈接指針每幅圖只能指向一個地點,而圖象地圖可以把圖象分成多個區域,每個區域指向不同的地點。你可以用圖象地圖編出很漂亮的html文件。
使用圖象地圖稍微復雜一點。圖象地圖不僅需要在html文件中說明,它還需要一個後綴為.map的文件,用來說明圖象分區及其指向的url的信息。
在.map文件中說明分區信息的格式如下:
rect url 左上角坐標,右下角坐標
poly url 各頂點坐標
circle
url 直徑兩端點坐標
default
url
rect指定一個矩形區域,該區域的位置由左上角坐標和右下角坐標說明。poly指定一多邊形區域,該區域的位置由各頂點坐標說明。circle
指定一圓形區域, 該區域的位置由垂直通過圓心的直徑與該圓的交點坐標說明。default 指定圖象地圖其它部分的url。坐標的寫法為:x,y
,各點坐標之間用空格分開。下面是一個完整的說明文件,
default http://www.ihep.ac.cn
rect http://www.ibm.com 140,20 280,60
poly http://www.microsoft.com 180,80 200,140
circle http://www.yahoo.com 80,140 80,100
圖象地圖需要一個特殊的處理程序 imagemap,imagemap放在/cgi-bin 中。在html 文件中引用圖象地圖的 格式為:<a
href="/cgi-bin/imagemap/mymap.map"><img
src=/uploadfile/2015/0521/20150521023602223.gif"
ismap></a>可以看出這是一個包含圖象元素的鏈接指針元素。圖象元素指明用於圖象地圖的圖象的url,並用Ismap屬性說明。需要說明的是鏈接指針中的href屬性,它由兩部分組成,第一部分是/cgi-bin/imagemap
,它指出用哪個程序來處理圖象地圖,它必須原樣寫入,第二部分才是圖形地圖的說明文件mymap.map。/cgi-bin/imagemap/mymap.map絕不表示
mymap.map在/cgi-bin/imagemap目錄中。在netscape擴展中,圖象地圖可以用一種比較簡化的方式來表示,這就是客戶端圖象地圖。用戶端地圖可以將圖象地圖的說明文件寫在html文件中,而且不需要另外的程序來處理。這就使html作者可以用同別的元素相一致的寫法來寫圖象地圖。
客戶端圖象地圖還有一個優點,當鼠標指向圖象地圖的不同區域時,浏覽器能顯示出各個區域所指向的url。但目前只有netscape2.0以上版本才支持這一擴展。
用戶端圖象地圖的格式為:<img
src="url" usemap="#mymap">src="url"
指定用作圖象地圖的圖象
usemap屬性指明這是客戶端圖象地圖"#mymap"是圖象文件說明部分的標記名,浏覽器尋找名字為mymap的<map>元素並從中得到圖象地圖的分區信息。客戶端圖象地圖的分區信息用<map
name=mapname>元素說明,name屬性命名<map>元素。圖象地圖的各個區域用<area shape="形狀"
coords="坐標" href="url">說明,形狀可以是:rect矩形,用左上角,右下角的坐標表示,各個坐標值之間用逗號分開;
po