麻辣家族討論版版's Archiver

小誌 發表於 2010-5-9 16:07

(教學第1篇)JavaScript概說與Script標籤

[color=DarkOrange]JavaScrip是一種網頁程式應用語言[/color],由JavaScript所完成的網頁程式並不需要透過模擬網路伺服器(IIS;Apache…)的機制來開啟,因為瀏覽器本身就具有執行這些網頁應用程式的能力。或許你會問:Java是不是一種程式語言?答案是肯定的,而且它還是種高階的物件導向語言!它的語法跟C語言很像,但程式的撰寫卻又比C語言更簡易,換句話說:它是C語言的陽春版。

[color=DarkOrange]HTML(HyperText Markup Language)超文件標記語言[/color]是構成網頁的基礎,但是利用HTML標記語言所撰寫出來的網頁是死的,也就是說它沒有互動性,HTML網頁一編寫完成後,網頁的內容、樣式…等等就固定了,除非你再編修它,否則每次瀏覽網頁所看的畫面都將是固定的!然而,若是加上JavaScript後就不一樣了,舉個例來說:瀏覽者在早上8點到中午12點時來到網站瀏覽網頁時我的首頁背景將是紅色的,在其餘時間光臨時,網頁背景則是黃色的;這樣簡單的背景顏色變化很難嗎?不難,但是光靠HTML標記語言是做不到的,除非你加上了JavaScript(當然,使用VBScript也行,不過,不在探討範圍)!

[color=Red][b][size=4]Script標籤[/size][/b][/color]
我們所撰寫的JavaScript要放在哪?當然是放在網頁原始碼中,但是JavaScript程式碼必須被包括在<Script></Sscript>這組標籤之內,同時還必須在<Script>標籤內指明我們所使用的網頁程式應用語言![code]<script language="javascript">

//在此撰寫我們的javascriptt程式

</script>[/code]Script標籤可以放在HTML網頁中的任何地方!當我們所撰寫的JavaScript程式碼被<Script></Sscript>這組標籤包括起來之後就變成了一支JavaScript程式!那這支JavaScript程式應該放在HTML文件(為避免誤會,在後續解說一律將網頁原始碼稱之為HTML文件或網頁文件)的哪個位置呢?答案是:都可以,不管是放在文件的開頭區(<HEAD></HEAD>標籤之間)或是網頁主體區(<BODY></BODY>標籤之間),只要你高興就行了啦!但,程式最好還是放在網頁文件位置的月前面越好,因為電腦很笨!它解讀文件的順序是由上而下依序解讀,若是我們的程式需要被使用,但是電腦又還沒解讀到程式區段的敘述,那可就出槌完蛋囉!

[color=Red][b][size=4]資料輸出[/size][/b][/color]
如果我們想將一段HEML內容[color=Blue]『輸出』[/color]到網頁中, 那該怎麼做呢?在標準的HTML文件中我們會採用下列的方法:直接在<body></body>標籤之間鍵入我們所要呈現的內容 (本例為輸出文字”網頁主體”):[code]<html>
<head>
<title>資料輸出</title>
</head>

<body>
網頁主體
</body>
</html>[/code]在上例中,我們使用固定式的傳統寫法,也就是在HTML文件中直接鍵入欲出現在網頁中的文字’網頁主體’,若我們想改採JavaScript程式輸出的方式來達到相同的結果,那我們就可以利用JavaScript的輸出函式,其標準格式如下所示:[code]document.write("輸出資料內容");[/code]上式中,我們所要輸出的資料必須使用雙引號包括起來,也就是說,雙引號的內容將會被輸出到網頁中:[code]<html>
<head>
<title>資料輸出</title>
</head>

<body>
<script language="javascript">
document.write("網頁主體");//在網頁中輸出"網頁主體"四個字
</script>
網頁主體
</body>
</html>[/code]當然,我們所輸出的資料也可以包含有HTML標籤,例如:我們希望呈現在網頁中的是一段置中對齊的紅色文字字串:[code]<body>
<script language="javascript">
document.write("<center><font color='red'>網頁主體</font>");
//在網頁中輸出位置水平置中且顏色為紅色的"網頁主體"四個字
</script>
</body>[/code][attach]152[/attach]

頁: [1]

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