網頁標題: 基本結構 (Structure)
 



JavaScript 初階教學

http://taiwantc.com/js/js_tut_a1.htm

基本結構 (Structure)

第一個例子: Hello, World

讓我們一同看看以下的 Hello, World 例子, 了解 JavaScript 的基本結構:




[/code]

執行

例子說明:

因為 JavaScript 是寫在 HTML 檔的, 所以 Netscape 定義了一個 <script> 標記 。
瀏覽器會將
<script> 與 </script> 中間的東西視作要執行的 JavaScript, 而不是HTML 。
通常適合撰寫 JavaScript 的位置有三個:

第一, 寫在 <head> 範圍,
好處是可以保證在載入
<body> 內容之前已經完全載入
<head> 的 JavaScript,
另一個好處是當你用某些 WYSIWYG 的網頁編輯器修改
<body> 內容時不會影響到寫在
<head> 的 JavaScript。

第二, 寫在 <body> 範圍,
當你要用 JavaScript 寫東西到
<body> 時就會用到。

第三, 寫在 </html> 之後,
好處是不會影響
<html> 範圍的內容,
適合一般免費網頁供應商在網頁加入廣告窗 (pop-up window) 。

<script> 有兩個屬性 (Attribute):

第一個屬性: language
以上的 Hello, World 例子中用了 language="JavaScript",其實 language 屬性可以有以下的值:

language 的值 解釋 不支援的瀏覽器 
JavaScript 是用 JavaScript 寫的 不支援 JavaScript 的瀏覽器
JavaScript1.1 JavaScript 版本 1.1 NN 3 之前 , IE 4 之前 (如 NN 2, IE 3)
JavaScript1.2 JavaScript 版本 1.2 NN 4 之前 , IE 4 之前 (如 NN 3, IE 3)
JavaScript1.3 JavaScript 版本 1.3
專為 NN 4.5 而設 NN 4.5 之前
LiveScript LiveScript 是 JavaScript 的舊名,
將來不知會否被支援  
VBscript 是用 Visual Basic Script 寫的,
只有 Internet Explorer 支援 所有版本的 Netscape Navigator

註: NN = Netscape Navigator . IE = Internet Explorer
不支援的瀏覽器會忽略該版本的 JavaScript,如果不註明該 JavaScript 是哪一個版本, 而當瀏覽器讀到它不支援的 JavaScript 時,便會產生錯誤。 有時為了方便, 你也可以不寫 language 屬性, 瀏覽器也會當它是 JavaScript 。

第二個屬性:src
你可以將 JavaScript 放在另一個檔案,然後將 src 設定為該檔的 URL。例如:

<script language="JavaScript"
src="http://www.somehost.com/directory/library.js">
</script>

好處:第一,所有 HTML 檔只須加入這一句就可以享用 library.js 內的 JavaScript ,第二,當瀏覽器關閉或不支援 JavaScript 功能時,瀏覽器就不用下載 JavaScript 的檔案,節省下載時間, 第三就是方便在某一頁寫入資料。

<!-- 和 //-->
<!-- 和 --> 其實是 HTML 的註解標記 (comment tag), 而 // 則是 JavaScript 的註解標記, 為什麼要在 JavaScript 的範圍內寫 HTML 的註解標記呢? 因為有些很舊的瀏覽器在未有 JavaScript 時出產, 這些瀏覽器當然不知道有 JavaScript 這東西, 它們會誤以為寫在 HTML 檔內 JavaScript 是 HTML 碼, 所以我們會好像 以上例子中加入 HTML 的註解標記, 令那些舊的瀏覽器忽略 JavaScript。 同理, 那個 // 是用來令 JavaScript 編譯器忽略 --> 標記的。

JavaScript 的註解標記有兩款:第一是 // ,第二是 /*  */。 第一款用來表示在 // 右邊的東西都是註解; 而第二款是用來表示所有在 /* 及 */ 範圍內的東西都是註解, 如果你想打很多行註解,用這款比較方便。

document.write("Hello, World");
這一句用到第二篇: 物件的方法與屬性 中所教的東西, 不過現在簡略說明一下, 讓大家有個初步的概念。

句中的 document (頁/文件) 是指當時瀏覽器視窗或窗柜顯示的一頁內容,但未必是一個實在的檔案內容, 因為該頁的全部內容可能是用 JavaScript 動態地寫出來的, 所以說 document 是顯示的內容, 而非檔案內容。

document 是一個物件, write 是 document 物件的一個方法, 它們中間有一點 (.), 是用來連貫它們的。

"Hello, World" 是 write 的參數 (Argument / Parameter), Hello, World 字串被雙引號括著, 即是說 Hello, World 是一個字串。句尾的分號 (;) 是用來表示該行的結尾。

總括來說, 這一行的作用就是叫瀏覽器在顯示中的一頁 (document) 寫 (write) 一句 Hello, World 的字串。 當然你也可以用 document.write 寫 HTML 標記, 這就可以動態地造出 HTML 網頁了。 以下句子會寫出斜體的字串 Hello 字串:

document.write("Hello")

<noscript> 和 
</noscript>
在某些情況下瀏覽器不能夠執行 JavaScript , 原因主要有兩個: 第一是舊的瀏覽器不知道有 JavaScript , 第二就是使用者關閉了 JavaScript 功能。 這時瀏覽器就會顯
<noscript> 範圍的內容, 讓網頁管理員通知瀏覽者該網頁有些內容不能如常運作。 你可以嘗試關閉 JavaScript 功能, 然後開啟 Hello, World 例子, 就會見到一句 Sorry, but your browser doesn't run JavaScript.。

這兩個標記一定要寫在  <body> 範圍。


回 · 我的 js 筆記蒐集 這一篇文章封面


本文張貼者:校校鴿〔張貼時間:民國100年5月19日(星期四)11點19分 | 更新次數 #2 | 最後更新:民國100年5月24日(星期二)10點06分〕 | 寫信給校校鴿

部落格首頁


學習的故鄉首頁
本站公告:〔您越需要我們,我們就越有創意〕 本站說明書:〔發現故鄉還有改進的地方,請來信告訴原丁們〕
觀察應用學習點數 :〔咱的故鄉有您的參與,會使我們有更大的發揮空間,展現更豐富精彩的學習畫面〕 〔期待藉由無障礙網頁設計,能讓視障小朋友更愛看書、更愛寫作且更愛學習〕:盲用電腦「心得分享」
〔為了讓我們有乾淨的學習環境,請勿任意在本站散播商業廣告與不合法文件或聯結〕:本站宣示