JavaScript知識筆記（一）——入門、語句、注釋、變數、函數、輸出內容、對話方塊、視窗，javascript視窗
JavaScript可以提供漂亮的網頁、令使用者滿意的上網體驗。
1.增強頁面動態效果(如:下拉式功能表、圖片輪播、資訊滾動等)
2.實現頁面與使用者之間的即時、動態互動(如:使用者註冊、登陸驗證等)
引用JavaScript：一、使用<script>標籤在HTML檔案中添加JavaScript代碼，:
二、HTML檔案和JS代碼分開,並單獨建立一個JavaScript檔案(簡稱JS檔案),其檔案尾碼通常為.js，然後將JS代碼直接寫在JS檔案中。
注意:在JS檔案中，不需要<script>標籤,直接編寫JavaScript代碼就可以了。
JS檔案不能直接運行，需嵌入到HTML檔案中執行，我們需在HTML中添加如下代碼，就可將JS檔案嵌入HTML檔案中。
<script src="script.js"></script>
我們可以將JavaScript代碼放在html檔案中任何位置，但是我們一般放在網頁的head或者body部分。
放在<head>部分
最常用的方式是在頁面中head部分放置<script>元素，瀏覽器解析head部分就會執行這個代碼，然後才解析頁面的其餘部分。
放在<body>部分
JavaScript代碼在網頁讀取到該語句的時候就會執行。
注意: javascript作為一種指令碼語言可以放在html頁面中任何位置，但是瀏覽器解釋html時是按先後順序的，所以前面的script就先被執行。比如進行頁面顯示初始化的js必須放在head裡面，因為初始化都要求提前進行（如給頁面body設定css等）；而如果是通過事件調用執行的function那麼對位置沒什麼要求的。
語句和符號：JavaScript語句是發給瀏覽器的命令。這些命令的作用是告訴瀏覽器要做的事情。
每一句JavaScript代碼格式: 語句;
先來看看下面代碼
<script type="text/javascript"> alert("hello!");</script>
例子中的alert("hello!");就是一個JavaScript語句。
一行的結束就被認定為語句的結束，通常在結尾加上一個分號";"來表示語句的結束。
看看下面這段代碼,有三條語句，每句結束後都有";"，按順序執行語句。
<script type="text/javascript"> document.write("I"); document.write("love"); document.write("JavaScript");</script>
注意:
1. “;”分號要在英文狀態下輸入，同樣，JS中的代碼和符號都要在英文狀態下輸入。
2. 雖然分號“;”也可以不寫，但我們要養成編程的好習慣，記得在語句末尾寫上分號。
注釋：注釋能提高代碼的可讀性，協助自己和別人閱讀和理解你所編寫的JavaScript代碼，注釋的內容不會在網頁中顯示。注釋可分為單行注釋與多行注釋兩種。
我們為了方便閱讀，注釋內容一般放到需要解釋語句的結尾處或周圍。
單行注釋，在注釋內容前加符號 “//”。
<script type="text/javascript"> document.write("單行注釋使用'//'"); // 我是注釋，該語句功能在網頁中輸出內容</script>
多行注釋以"/*"開始，以"*/"結束。
<script type="text/javascript"> document.write("多行注釋使用/*注釋內容*/"); /* 多行注釋 養成書寫注釋的良好習慣 */</script>變數：
從字面上看，變數是可變的量；從編程角度講，變數是用於儲存某種/某些數值的儲存空間。我們可以把變數看做一個盒子，為了區分盒子，可以用BOX1,BOX2等名稱代表不同盒子，BOX1就是盒子的名字（也就是變數的名字）。
定義變數使用關鍵字var,文法如下：
var 變數名
變數名可以任意取名，但要遵循命名規則:
1.變數必須使用字母、底線(_)或者美元符($)開始。
2.然後可以使用任意多個英文字母、數字、底線(_)或者美元符($)組成。
3.不能使用JavaScript關鍵詞與JavaScript保留字。
變數要先聲明再賦值，如下：
var mychar;mychar="javascript";var mynum = 6;
變數可以重複賦值，如下：
var mychar;mychar="javascript";mychar="hello";
注意:
1. 在JS中區分大小寫，如變數mychar與myChar是不一樣的，表示是兩個變數。
2. 變數雖然也可以不聲明，直接使用，但不規範，需要先聲明，後使用。
判斷語句：if...else語句是在指定的條件成立時執行代碼，在條件不成立時執行else後的代碼。
文法:
if(條件){ 條件成立時執行的代碼 }else{ 條件不成立時執行的代碼 }
假設我們通過年齡來判斷是否為成年人，如年齡大於等於18歲，是成年人，否則不是成年人。代碼錶示如下:
<script type="text/javascript"> var myage = 18; if(myage>=18) //myage>=18是判斷條件 { document.write("你是成年人。");} else //否則年齡小於18 { document.write("未滿18歲，你不是成年人。");}</script>
函數是完成某個特定功能的一組語句。如沒有函數，完成任務可能需要五行、十行、甚至更多的代碼。這時我們就可以把完成特定功能的代碼塊放到一個函數裡，直接調用這個函數，就省重複輸入大量代碼的麻煩。
如何定義一個函數呢？基本文法如下:
function 函數名(){ 函數代碼;}
說明:
1. function定義函數的關鍵字。
2. "函數名"你為函數取的名字。
3. "函數代碼"替換為完成特定功能的代碼。
我們來編寫一個實現兩數相加的簡單函數,並給函數起個有意義的名字：“add2”，代碼如下：
function add2(){ var sum = 3 + 2; alert(sum);}
函數調用:函數定義好後，是不能自動執行的，所以需調用它，只需直接在需要的位置寫函數就ok了,代碼如下(單擊按鈕後，調用函數onclick):
輸出內容：document.write() 可用於直接向 HTML 輸出資料流寫內容。簡單的說就是直接在網頁中輸出內容。
第一種:輸出內容用“”括起，直接輸出""號內的內容。
<script type="text/javascript"> document.write("I love JavaScript！"); //內容用""括起來，""裡的內容直接輸出。</script>
第二種:通過變數，輸出內容。
<script type="text/javascript"> var mystr="hello world!"; document.write(mystr); //直接寫變數名，輸出變數儲存的內容。</script>
第三種:輸出多項內容，內容之間用+號串連。
<scripttype="text/javascript"> var mystr="hello"; document.write(mystr+"I love JavaScript"); //多項內容之間用+號串連</script>
第四種:輸出HTML標籤，並起作用，標籤使用“”括起來。
<script type="text/javascript"> var mystr="hello";document.write(mystr+"<br>");//輸出hello後，輸出一個分行符號 document.write("JavaScript");</script>
警告對話方塊：
我們在訪問網站的時候，有時會突然彈出一個小視窗，上面寫著一段提示資訊文字。如果你不點擊“確定”，就不能對網頁做任何操作，這個小視窗就是使用alert實現的。
文法:
alert(字串或變數);
看下面的代碼:
<script type="text/javascript"> var mynum = 30; alert("hello!"); alert(mynum);</script>
注:alert彈出訊息對話方塊(包含一個確定按鈕)。
結果:按順序彈出訊息框
注意:
1. 在點擊對話方塊"確定"按鈕前，不能進行任何其它操作。
2. 訊息對話方塊通常可以用於偵錯工具。
3. alert輸出內容，可以是字串或變數，與document.write 相似。
確認對話方塊：confirm 訊息對話方塊通常用於允許使用者做選擇的動作，如：“你對嗎？”等。彈出對話方塊(包括一個確定按鈕和一個取消按鈕)。
文法:
confirm(str);
參數說明:
str：在訊息對話方塊中要顯示的文本返回值: Boolean值
返回值:
當使用者點擊"確定"按鈕時，返回true當使用者點擊"取消"按鈕時，返回false
注: 通過返回值可以判斷使用者點擊了什麼按鈕
看下面的代碼:
<script type="text/javascript"> var mymessage=confirm("你喜歡JavaScript嗎?"); if(mymessage==true) { document.write("很好,加油!"); } else { document.write("JS功能強大，要學習噢!"); }</script>
結果:
注: 訊息對話方塊是排它的，即使用者在點擊對話方塊按鈕前，不能進行任何其它操作。
提問對話方塊：prompt彈出訊息對話方塊,通常用於詢問一些需要與使用者互動的資訊。彈出訊息對話方塊（包含一個確定按鈕、取消按鈕與一個文本輸入框）。
文法:
prompt(str1, str2);
參數說明：
str1: 要顯示在訊息對話方塊中的文本，不可修改str2：文字框中的內容，可以修改
返回值:
1. 點擊確定按鈕，文字框中的內容將作為函數返回值2. 點擊取消按鈕，將返回null
看看下面代碼:
var myname=prompt("請輸入你的姓名:");if(myname!=null) { alert("你好"+myname); }else { alert("你好 my friend."); }
結果:
注:在使用者點擊對話方塊的按鈕前，不能進行任何其它操作。
開啟新視窗：open() 方法用於開啟一個新的視窗。
文法：
window.open(<URL>, <視窗名稱>, <參數字串>)
參數說明:
URL：開啟視窗的網址或路徑。視窗名稱：被開啟視窗的名稱。可以是"_top"、"_blank"、"_selft"等。參數字串：設定視窗參數，各參數用逗號隔開。
參數表:
例如:開啟http://www.imooc.com網站，大小為300px * 200px，無菜單，無工具列，無狀態欄，有捲軸視窗：
<script type="text/javascript"> window.open('http://www.imooc.com','_blank','width=300,height=200,menubar=no,toolbar=no, status=no,scrollbars=yes')</script>
注意：
1.參數之間逗號及等號前後有空格，該字串無效，只有刪除空格才能正常運行。
2.運行結果考慮瀏覽器安全色問題。
關閉視窗：close()關閉視窗
用法：
window.close(); //關閉本視窗
或
<視窗對象>.close(); //關閉指定的視窗
例如:關閉建立的視窗。
<script type="text/javascript"> var mywin=window.open('http://www.imooc.com'); //將新打的視窗對象，儲存在變數mywin中 mywin.close();</script>
注意:上面代碼在開啟新視窗的同時，關閉該視窗，看不到被開啟的視窗。
————————————————————————————————————————————————————————————————
以上內容參考自慕課網：http://www.imooc.com
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
