diff --git a/1-js/02-first-steps/01-hello-world/1-hello-alert/task.md b/1-js/02-first-steps/01-hello-world/1-hello-alert/task.md index afed6a91d..c5e46cb2c 100644 --- a/1-js/02-first-steps/01-hello-world/1-hello-alert/task.md +++ b/1-js/02-first-steps/01-hello-world/1-hello-alert/task.md @@ -2,11 +2,11 @@ importance: 5 --- -# Show an alert +# 顯示一個提示語 -Create a page that shows a message "I'm JavaScript!". +創建一個頁面來顯示 "I'm JavaScript!" 提示語。 -Do it in a sandbox, or on your hard drive, doesn't matter, just ensure that it works. +寫在沙盒或是你的硬碟中都沒有關係，只要你確保它能夠正確運行。 [demo src="solution"] diff --git a/1-js/02-first-steps/01-hello-world/2-hello-alert-ext/solution.md b/1-js/02-first-steps/01-hello-world/2-hello-alert-ext/solution.md index f42c41e6d..906372c46 100644 --- a/1-js/02-first-steps/01-hello-world/2-hello-alert-ext/solution.md +++ b/1-js/02-first-steps/01-hello-world/2-hello-alert-ext/solution.md @@ -1,8 +1,8 @@ -The HTML code: +HTML 程式碼： [html src="index.html"] -For the file `alert.js` in the same folder: +使用在同一個資料夾中的 `alert.js`： [js src="alert.js"] diff --git a/1-js/02-first-steps/01-hello-world/2-hello-alert-ext/task.md b/1-js/02-first-steps/01-hello-world/2-hello-alert-ext/task.md index 26168d6a7..e2f974611 100644 --- a/1-js/02-first-steps/01-hello-world/2-hello-alert-ext/task.md +++ b/1-js/02-first-steps/01-hello-world/2-hello-alert-ext/task.md @@ -2,8 +2,8 @@ importance: 5 --- -# Show an alert with an external script +# 使用外部腳本顯示提示語 -Take the solution of the previous task . Modify it by extracting the script content into an external file `alert.js`, residing in the same folder. +使用前一個任務的答案 。將腳本的內容抽出至一個外部檔案 `alert.js` 並將它放在同個資料夾之下。 -Open the page, ensure that the alert works. +開啟頁面，確保提示語正確運行。 diff --git a/1-js/02-first-steps/01-hello-world/article.md b/1-js/02-first-steps/01-hello-world/article.md index 489c01adf..53b412c23 100644 --- a/1-js/02-first-steps/01-hello-world/article.md +++ b/1-js/02-first-steps/01-hello-world/article.md @@ -1,17 +1,17 @@ # Hello, world! -This part of the tutorial is about core JavaScript, the language itself. +這部份的教程是關於 JavaScript 的核心，討論的是這個語言自身。 -But we need a working environment to run our scripts and, since this book is online, the browser is a good choice. We'll keep the amount of browser-specific commands (like `alert`) to a minimum so that you don't spend time on them if you plan to concentrate on another environment (like Node.js). We'll focus on JavaScript in the browser in the [next part](/ui) of the tutorial. +話雖如此，我們還是需要一個執行環境來運行我們的腳本（scripts）。由於本書是線上教學，瀏覽器做為執行環境看起來是一個好選擇。我們會盡可能地減少僅限於瀏覽器的指令（像是 `alert`），讓你在其他環境（像是 Node.js）運行時，不必多花心力在這些指令上面。有關於 JavaScript 在瀏覽器中運行的細節會在[之後的章節](/ui)介紹。 -So first, let's see how we attach a script to a webpage. For server-side environments (like Node.js), you can execute the script with a command like `"node my.js"`. +首先，讓我們看看如何在一個網頁中添加腳本。在伺服器端（像是 Node.js），你可以用 `"node my.js"` 來運行你的指令。 -## The "script" tag +## "script" 標籤 -JavaScript programs can be inserted into any part of an HTML document with the help of the ` ``` - This trick isn't used in modern JavaScript. These comments hid JavaScript code from old browsers that didn't know how to process the ` ``` -Here, `/path/to/script.js` is an absolute path to the script from the site root. One can also provide a relative path from the current page. For instance, `src="script.js"` would mean a file `"script.js"` in the current folder. +這邊的 `/path/to/script.js` 代表從網站根目錄開始，腳本檔案的絕對路徑，我們也可以提供相對於當前頁面的相對路徑。舉例來說，`src="script.js"` 指的是目前資料夾中的一個 `"script.js"` 檔案。 -We can give a full URL as well. For instance: +我們也可以提供完整的 URL，例如： ```html ``` -To attach several scripts, use multiple tags: +如果要添加多個腳本，請使用多個標籤： ```html @@ -90,29 +90,29 @@ To attach several scripts, use multiple tags: ``` ```smart -As a rule, only the simplest scripts are put into HTML. More complex ones reside in separate files. +一般來說，只有簡單的腳本適合直接寫在 HTML 中。比較複雜的腳本請放在獨立的檔案。 -The benefit of a separate file is that the browser will download it and store it in its [cache](https://en.wikipedia.org/wiki/Web_cache). +使用獨立的檔案的好處是，瀏覽器會下載它且將之存入 [快取（cache）](https://en.wikipedia.org/wiki/Web_cache)。 -Other pages that reference the same script will take it from the cache instead of downloading it, so the file is actually downloaded only once. +而當其他頁面需要使用同一份腳本時，就會省略下載而從快取中拿取，這個腳本實際上只被下載了一次。 -That reduces traffic and makes pages faster. +這可以減少流量而使頁面讀取變快。 ``` -````warn header="If `src` is set, the script content is ignored." -A single ` ``` -We must choose either an external ` @@ -122,11 +122,11 @@ The example above can be split into two scripts to work: ``` ```` -## Summary -- We can use a ``. +## 總結 +- 使用 `` 來引入外部腳本。 -There is much more to learn about browser scripts and their interaction with the webpage. But let's keep in mind that this part of the tutorial is devoted to the JavaScript language, so we shouldn't distract ourselves with browser-specific implementations of it. We'll be using the browser as a way to run JavaScript, which is very convenient for online reading, but only one of many. +對於瀏覽器和腳本在頁面上的交互作用還有很多等著我們學習。但請記得，此部份的教程還是關注在 JavaScript 語言本身，我們暫時先不岔題到各個瀏覽器的實作。我們的確是用瀏覽器當做一種 JavaScript 的執行環境，只是因為在線上閱讀時更方便使用，但它只是多種環境的其中一種。