JavaScript 入門指南 - 如何執行 Javascript 程式

JavaScript 程式可以直接寫在 HTML 文件的 <script> 標籤中，然後用瀏覽器開啟 HTML 文件就會直接執行




當然，這是一個方式，不過我們打算把 JavaScript 程式放在 .js 檔案中，我們提供的簡單範例如下
?
1
2
3
4
5
6
7
8
9
10
11
12
document.write("<br / >");
document.write(document + "<br / >");
document.write("↑↑ 上面是 document 的字串形式<br / >");
document.write("<br / >");
document.write("程式執行結束 ...<br / >");
 
/* 《程式語言教學誌》的範例程式
   http://pydoing.blogspot.com/
   檔名：demo.js
   功能：示範 JavaScript 程式
   作者：張凱慶
   時間：西元 2012 年 12 月 */


然後用另一個 HTML 文件載入這個 .js 檔案，如下
?
1
2
3
4
5
6
7
8
<script language="JavaScript" src="demo.js"></script>
 
<!-- 《程式語言教學誌》的範例程式
      http://pydoing.blogspot.com/
      檔名：demo.html
      功能：示範 JavaScript 程式
      作者：張凱慶
      時間：西元 2012 年 12 月 -->


demo.html 只有 <script> 標籤，一般來講，完整的 HTML 文件還需要有 <html> 、 <head> 、 <body> 等標籤，如下
?
1
2
3
4
5
6
7
<html>
<head>
<title>Demo</title>
<script language="JavaScript" src="demo.js"></script>
</head>
<body></body>
</html>

由於現在一般瀏覽器都會自動補足 <html> 、 <head> 、 <body> 等必要標籤，因此我們這裡只有用 <script> 而已。


由於 JavaScript 是直譯 (interpret) 式的程式語言 (programming language) ，因此用瀏覽器直接開啟 demo.html 就會載入執行，結果如下



所謂直譯係指程式逐行被執行，程式中是否有語法錯誤，如果程式中有語法錯誤 (syntax error) ，瀏覽器就會暫停執行，例如第 4 行結尾漏掉雙引號
8
document.write("<br / >);


瀏覽器就無法執行，這時我們開啟錯誤主控台，就可以發現錯誤發生的原因



這是說解析到第 4 行的時候，發現有語法錯誤，因此停止執行程式。


由於這個例子是用 JavaScript 寫入 HTML 網頁內容，因此瀏覽器通常會先檢查完語法才執行。


第一個 demo.js 相當簡單，連續使用 write() 印出訊息，只有使用 document 變數 (variable) 與字串 (string) 常數兩種資料型態 (data type) ，其實 JavaScript 還有很多種資料型態，下面我們繼續看看資料型態與變數吧！


中英文術語對照
直譯interpret
程式語言programming language
語法錯誤syntax error
字串string
資料型態data type
變數variable


您可以繼續參考
基礎篇


相關目錄
回 JavaScript 入門指南
回 JavaScript 教材
回首頁


參考資料
https://developer.mozilla.org/en-US/docs/JavaScript/Guide/JavaScript_Overview
http://www.w3schools.com/JS/js_howto.asp
http://www.w3schools.com/JS/js_whereto.asp
http://www.tutorialspoint.com/javascript/javascript_syntax.htm
http://www.tutorialspoint.com/javascript/javascript_enabling.htm
標籤： ,

沒有留言:

張貼留言

訂閱： 張貼留言 (Atom)