本章 希望 教育 学生 JavaScript 的相關知識, 幫 學生 補習 study.
JavaScript -教育 学生 補習 >> 用法>> 環境建置
JavaScript 的檔案只要使用一般的文字編輯器即可編輯（存成 .js 檔案），也可以使用 Sublime Text 等編輯器進行開發，JSBin 這個線上工具進行測試（當然你也可以使用 Chrome、Firefox 等瀏覽器的開發者工具）。除了編輯器外，實際開發上我們也會需要用到 Node.js 開發環境 和 NPM 套件管理系統（按照 Node.js 官方指示即可安裝）。Node.js 是一個開放原始碼、跨平台的、可用於伺服器端和網路應用的執行環境。
<script> 标签
在 HTML 中，JavaScript 代码必须位于 <script> 与 </script> 标签之间。
实例
<script>
document.getElementById("demo").innerHTML = "我的第一段 JavaScript";
</script>
JavaScript -教育 学生 補習 >> 用法>> JavaScript 函数和事件
JavaScript 函数是一种 JavaScript 代码块，它可以在调用时被执行。
例如，当发生事件时调用函数，比如当用户点击按钮时。
提示：您将在稍后的章节学到更多有关函数和事件的知识。
JavaScript -教育 学生 補習 >> 用法>> <head> 或 <body> 中的 JavaScript
您能够在 HTML 文档中放置任意数量的脚本。
脚本可被放置与 HTML 页面的 <body> 或 <head> 部分中，或兼而有之。
<head> 中的 JavaScript
在本例中，JavaScript 函数被放置于 HTML 页面的 <head> 部分。
该函数会在按钮被点击时调用：
实例
<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "段落被更改。";
}
</script>
</head>
<body>
<h1>一张网页</h1>
<p id="demo">一个段落</p>
<button type="button" onclick="myFunction()">试一试</button>
</body>
</html>
<body> 中的 JavaScript
在本例中，JavaScript 会在页面加载时向 HTML 的 <body> 写文本：
实例
<!DOCTYPE html> <html> <body> . . <script> document.write(“<h1>这是一个标题</h1>”); document.write(“<p>这是一个段落</p>”); </script> . . </body> </html>
JavaScript -教育 学生 補習 >> 用法>> 外部的 JavaScript
也可以把脚本保存到外部文件中。外部文件通常包含被多个网页使用的代码。
外部 JavaScript 文件的文件扩展名是 .js。
如需使用外部文件，请在 <script> 标签的 “src” 属性中设置该 .js 文件：
实例
<!DOCTYPE html> <html> <body> <script src=”myScript.js”></script> </body> </html>
你可以将脚本放置于 <head> 或者 <body>中，放在 <script> 标签中的脚本与外部引用的脚本运行效果完全一致。
myScript.js 文件代码如下：function myFunction() { document.getElementById(“demo”).innerHTML=”我的第一个 JavaScript 函数”; }
| 外部脚本不能包含 <script> 标签。 |
注意细节：
1、在标签中填写 onclick 事件调用函数时，不是 onclick=函数名， 而是 onclick=函数名+()，代码如下：
<script>
function myfunction(){
document.getElementById("demo").innerHTML="onclick事件触发";
}</script>
</head>
<body>
<h1 id="demo">一个段落</h1>
<button onclick="myfunction()" type="button">点击这里</button>
</body>
2、外部 javascript 文件不使用 <script> 标签，直接写 javascript 代码。
3、HTML 输出流中使用 document.write，相当于添加在原有html代码中添加一串html代码。而如果在文档加载后使用（如使用函数），会覆盖整个文档。
使用函数来执行document.write代码如下：
<script>
function myfunction(){
document.write("使用函数来执行doucment.write，即在文档加载后再执行这个操作，会实现文档覆盖");
}
document.write("<h1>这是一个标题</h1>");
document.write("<p>这是一个段落。</p>");
</script>
<p >
您只能在 HTML 输出流中使用 <strong>document.write</strong>。
如果您在文档已加载后使用它（比如在函数中），会覆盖整个文档。
</p>
<button type="button" onclick="myfunction()">点击这里</button>
JavaScript -教育 学生 補習 >> 用法>> 變數
在程式語言中變數是一個暫時儲存資料的地方，賦值給變數的值都會有對應的資料型態，然而 JavaScript 是弱型別（Weak type）所以會有自動轉型的情形。
在 JavaScript 中，全域變數將使用 var，而在 ES6 中為了解決變數污染或誤用情形將 block-scope 的變數使用 let，若你需要固定不變的常數則是使用 const。 其中變數型別又分為：Primitive Data Type：String、Number、Boolean（ true 或 false）、undefinded、null，Reference Data Types：Object 兩種，差別在於將物件變數賦值給另外一個變數時是把引用賦值給新變數，所以當新變數更改屬性時會影響到原來物件。
Primitive Data Type：
| var num = 12; const str = ‘Mark’; function checkLike() { let isActived = true; } // console.log 可以讓開發者透過瀏覽器開發者工具看到訊息，方便除錯 console.log(num); console.log(str); // 因為 let 是 function block scope，故會產生 “ReferenceError: isActived is not defined 錯誤 console.log(isActived); |
Reference Data Types：
| // 將物件變數賦值給另外一個變數時是把引用賦值給新變數，所以當新變數更改屬性時會影響到原來物件 let a = { name: ‘Zuck’ }; console.log(a); let b = a; b.name = ‘Jack’; console.log(a); |
电子计算机 -教育 -IT 電腦班>>Facebook 聯絡:
找老師 24 hours facebook channel :
https://www.facebook.com/itteacheritfreelance/?ref=aymt_homepage_panel
Leave a Reply