NUTC 森Lab | 前端教學文件
  • Introduction
  • Ch1. Git版本控制工具使用
    • Git首次設定與初始化
    • Git檔案狀態
    • git checkout
    • Git分支合併
    • Git 推上 Github 囉
    • Git 回復檔案
    • ex. 練習作業
  • Ch2. 認識 HTML5 與 CSS4 -1
    • 深入 HTML
    • 熟悉 CSS
    • ex. 練習作業
    • CSS單位
    • CSS排版須知: Box Model
    • CSS文字、背景、表格、display
    • ex. 練習作業
  • Ch3. 認識 HTML5 與 CSS4 -2
    • CSS Position
    • CSS Transition
    • ex. 切版開發實戰
  • Ch4. 第一次接觸JavaScript就上手
    • 取得DOM元素節點
    • JavaScript事件
    • 動態CSS
    • console.log()
    • JavaScript的變數＆運算子
    • JavaScript的函數
    • ex. 練習作業
  • Ch5. 進階JavaScript
    • JavaScript的物件（Object）
    • 更多JavaScript內建函數
    • setInterval() & setTimeout()
    • JSON
    • ex. 練習作業
  • Ch6. 初次見面jQuery
    • jQuery基礎用法
    • Ajax
    • ex. 練習作業
  • Ch7. jQuery 開發實戰 -1
  • Ch8. jQuery 開發實戰 -2
  • Ch9. 網頁速成好工具 Boostrap4
  • Ch10. RWD響應式網頁實作
  • Ch11. CSS再進階！使用Compass
Powered by GitBook
On this page
  • 規格版本
  • 開發環境

Ch4. 第一次接觸JavaScript就上手

Previousex. 切版開發實戰Next取得DOM元素節點

Last updated 6 years ago

在前幾章課程中，我們學習了很多如何利用Html & CSS做出精美的網頁，但這樣的網頁，只能稱作靜態網頁，若需要有更多動態效果的互動網頁，我們需要使用客戶端的網頁技術，像是JavaScript這樣的腳本語言。

規格版本

ECMAScript是目前Javascript統一的規格標準。

  • ECMA-262的第一個版本於1997年6月被 ECMA 組織採納。

  • ECMAScript 3 (ES3) 發行於1999年底。

  • ECMAScript 4 (ES4) 棄用(原因是貿然大幅度更新對用戶不太好所以改成每年逐一釋出)。

  • ECMAScript 5 (ES5) 發行於2009年底。

  • ECMAScript 6 (ES6) / ECMAScript 2015 (ES2015) 發行於2015年中。

  • ES2016 （ES7）2016年6月發布，為ECMAScript的第7個版本。

  • ES2017 （ES8）2017年6月發布，為ECMAScript的第8個版本。

問：ES 是什麼？ 答：ES 是 ECMAScript 的縮寫。 ES 後面跟著數字，則是ECMAScript的不同版本號。

開發環境

現在，我們要開始進入JS的殿堂～

首先請在VSCode新增ㄧHTML檔案。

HTML引入JavaScript程式同樣有幾種方式：

  1. External Link

<head>
    <script type="text/javascript" src="test.js"></script>
</head>

2. Embed 瀏覽器只要讀到<script>標籤，就會知道內含JavaScript程式碼。

<script type="text/javascript">
    .....
</script>

HTML、CSS與JavaScript之間關係