麻辣家族討論版版's Archiver

小誌 發表於 2010-5-18 18:51

(教學第19篇)網頁物件 下篇

[color=darkorange][size=5][b]超鏈結顏色[/b][/size][/color]
網頁中超鏈結的顏色設定分為三種:超鏈結的顏色(未被使用過)、連結動作中的超鏈結顏色、已經被使用過的超鏈結顏色,超鏈結這三種情況的顏色設定同屬<BODY>標籤的屬性:
[table]
[tr][td=1,1,172][p=30, 2, left][font=全真中圓體][font=新細明體][size=2]未使用[/size][/font][/font][/p][p=30, 2, left][size=2][font=全真中圓體][font=新細明體]<BODY LINK=[/font][/font]”[font=全真中圓體][font=新細明體]顏色[/font][/font]”[font=全真中圓體][font=新細明體]>[/font][/font][/size][/p][/td][td=1,1,172][p=30, 2, left][font=全真中圓體][font=新細明體][size=2]動作中[/size][/font][/font][/p][p=30, 2, left][size=2][font=全真中圓體][font=新細明體]<BODY ALINK=[/font][/font]”[font=全真中圓體][font=新細明體]顏色[/font][/font]”[font=全真中圓體][font=新細明體]>[/font][/font][/size][/p][/td][td=1,1,172][p=30, 2, left][font=全真中圓體][font=新細明體][size=2]已使用[/size][/font][/font][/p][p=30, 2, left][size=2][font=全真中圓體][font=新細明體]<BODY VLINK=[/font][/font]”[font=全真中圓體][font=新細明體]顏色[/font][/font]”[font=全真中圓體][font=新細明體]>[/font][/font][/size][/p][/td][/tr]
[/table]

使用JavaScript時的document物件相對屬性則為:
[table]
[tr][td=1,1,516][p=30, 2, center][font=全真中圓體][font=新細明體][size=2]未使用[/size][/font]
[font=新細明體][size=2]d[/size][/font][/font][size=2][font=全真中細圓體][font=新細明體]ocument.linkColor=[/font][/font]”[font=新細明體][font=全真中細圓體]#[/font][font=全真中細圓體]RGB16進制的顏色碼/顏色英文單字[/font][/font]”[font=全真中細圓體][/font][/size][/p][/td][/tr]
[tr][td=1,1,516][p=30, 2, center][font=全真中圓體][font=新細明體][size=2]動作中[/size][/font]
[/font][size=2][font=全真中細圓體][font=新細明體]document.alinkColor=[/font][/font]”[font=新細明體][font=全真中細圓體]#[/font][font=全真中細圓體]RGB16進制的顏色碼/顏色英文單字[/font][/font]”[font=全真中細圓體][/font][/size][/p][/td][/tr]
[tr][td=1,1,516][p=30, 2, center][font=全真中圓體][font=新細明體][size=2]已使用[/size][/font]
[/font][size=2][font=全真中細圓體][font=新細明體]document.vlinkColor=[/font][/font]”[font=新細明體][font=全真中細圓體]#[/font][font=全真中細圓體]RGB16進制的顏色碼/顏色英文單字[/font][/font]”[font=全真中細圓體][/font][/size][/p][/td][/tr]
[/table]


[color=Magenta][b][size=4]實作學習:[/size][/b][/color]
因為與超鏈結相關的三個顏色設定用法相同,所以,就以未使用過的超鏈結顏色「linkColor」屬性設定為例,製作一個自動變換的色彩的超鏈結。
7-6.htm[code]<HTML>
<HEAD>
<TITLE>超鏈結顏色</TITLE>
</HEAD>
<SCRIPT LANGUAGE="JavaScript">
//設定超鏈結顏色切換的旗標變數
n=0
//超鏈結顏色切換函式
function changelinkcolor()
{
if (n == 0 )
   {document.linkColor="olive"}
else if (n == 1 )
    {document.linkColor="teal"}
else if (n == 2 )
     {document.linkColor="red"}
else if (n == 3 )
     {document.fgColor="blue"}
else if (n == 4 )
     {document.linkColor="maroon"}
else if (n == 5 )
     {document.linkColor="navy"}
else if (n == 6 )
      {document.fgColor="lime"}
else if (n == 7 )
      {document.linkColor="fuschia"}
else if (n == 8 )
     {document.linkColor="green"}
else if (n == 9 )
      {document.linkColor="purple"}
else if (n == 10 )
       {document.linkColor="gray"}
else if (n == 11 )
      {document.linkColor="yellow"}
else if (n == 12 )
       {document.linkColor="aqua"}
else if (n == 13 )
        {document.linkColor="black"}
else if (n == 14 )
       {document.linkColor="white"}
else if (n == 15 )
       {document.linkColor="silver"}
n++ //等同n=n+1
//如果旗標變數值大於預設顏色的個數,則將變數內容歸零
if (n>15)
{n=0}
//重複呼叫超鏈結顏色切換函式
setTimeout("changelinkcolor()", 500)
}
</SCRIPT>
<!-- 網頁載入時呼叫超鏈結顏色切換函式 -->
<BODY OnLoad="changelinkcolor()">
<a href="test#">不斷變換顏色的超鏈結</a>
</BODY>
</HTML>[/code][attach]671[/attach]

小誌 發表於 2010-5-18 18:53

[color=DarkOrange][size=5][b]網頁更新日期[/b][/size][/color]
在我們建立檔案的時候,我們的電腦就會幫我們將這個檔案的建立日期記錄起來,稱之為「建檔日期」,這個檔案建立日期可不是固定的!當我們再次編輯這個檔案,而做了「存檔」的動作,則這個檔案的建立日期就改變了,也就成為所謂的:「修改日期」。
[attach]672[/attach]

網頁文件也是一個檔案喔!因此,網頁也有所謂的「建檔日期」,或者,該稱之為「修改日期」,因為,我們會經常進行網頁的更新,建檔的日期已不可考了,能得知的恐怕只有最後一次進行編修時的「修改日期」。
[attach]673[/attach]

為了讓網友知道我們是很用心的在維護網站,並且時時的更新網頁資訊,因此很多網主都會在網頁中告知網在最後的更新日期,如上圖。
那更新日期的訊息我們要自己一頁一頁的加上去嗎?你不會這樣做吧?!粉累耶!我們可以直接利用JavaScript來自動幫我們做「更新資訊」啦!我們只要直接取用document物件的「lastModified」屬性就好了。[code]document.lastModified[/code][color=Magenta][size=4][b] 實作學習:[/b][/size][/color]
在網頁中撰寫一個會自動更新網頁日期的JavaScript程式。
7-7.htm[code]<HTML>
<HEAD>
<TITLE>更新日期</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE="JavaScript">
document.write("本站最後更新日期:"+document.lastModified)
</script>
</BODY>
</HTML>[/code][attach]674[/attach]

頁: [1]

麻辣家族討論版版為 麻辣學園 網站成員  由 昱得資訊工作室 © Since 1993 所提供