首頁 > 開發者 > JavaScript
標籤：必須 屬性 作者 was 次數 數組 orm span rect
JavaScript 基礎知識JavaScript 是屬於網路的指令碼語言！
JavaScript 被數百萬計的網頁用來改進設計、驗證表單、檢測瀏覽器、建立cookies，以及更多的應用。
JavaScript 是網際網路上最流行的指令碼語言。
JavaScript 很容易使用！你一定會喜歡它的！
JavaScript 簡介
在數百萬張頁面中，JavaScript 被用來改進設計、驗證表單、檢測瀏覽器、建立cookies，等等等等。JavaScript 是網際網路上最流行的指令碼語言，並且可在所有主要的瀏覽器中運行，比方說 Internet Explorer、 Mozilla、Firefox、Netscape、和 Opera。
JavaScript 能做什嗎？
真實的名稱是 ECMAScript
JavaScript 的正式名稱是 "ECMAScript"。 這個標準由 ECMA 組織發展和維護。ECMA-262 是正式的 JavaScript 標準。這個標準基於 JavaScript (Netscape) 和 JScript (Microsoft)。Netscape (Navigator 2.0) 的 Brendan Eich 發明了這門語言，從 1996 年開始，已經出現在所有的 Netscape 和 Microsoft 瀏覽器中。ECMA-262 的開發始於 1996 年，在 1997 年 7 月，ECMA 會員大會採納了它的首個版本。在 1998 年，該標準成為了國際 ISO 標準 (ISO/IEC 16262)。這個標準仍然處於發展之中。
如何? JavaScript
HTML 的 <script> 標籤用於把 JavaScript 代碼插入 HTML 頁面當中。
方式一：
<script language="javascript" type="text/javascript">
document.write("這是由javascript輸出的文字");
</script>
方式二：
<script src="one.js"></script>
如何與老的瀏覽器打交道
那些不支援 JavaScript 的瀏覽器會把指令碼作為頁面的內容來顯示。為了防止這種情況發生，我們可以使用這樣的 HTML 注釋標籤：
<script type="text/javascript">
<!--
document.write("Hello World!");
//—>
</script>
注釋行末尾的兩個正斜杠是 JavaScript 的注釋符號，它會阻止 JavaScript 編譯器對這一行的編譯。
把 JavaScript 放置到何處
當頁面載入時，會執行位於 body 部分的 JavaScript。當被調用時，位於 head 部分的 JavaScript 才會被執行。
你可以在文檔中放置任何數量的指令碼，因此你既可以把指令碼放置到 body，又可以放置到 head 部分。
需要注意的是：
在一個HTML文檔中，所有位置的指令碼代碼，包括引入的外部js代碼，他們都將成為一個整體。你可以把他們想象成在一個類中。因此，有時來自不同檔案的重名方法或重名變數，會導致意想不到的錯誤發生。
JavaScript 語句
JavaScript 是由瀏覽器執行的語句序列。這些命令的作用是告訴瀏覽器要做的事情。通常要在每行語句的結尾加上一個分號。大多數人都認為這是一個好的編程習慣，而且在 web 上的 JavaScript 案例中也常常會看到這種情況。
分號是可選的（根據 JavaScript 標準），瀏覽器把行末作為語句的結尾。正因如此，常常會看到一些結尾沒有分號的例子。通過使用分號，可以在一行中寫多條語句。
JavaScript 變數
JavaScript 變數名稱的規則：
JavaScript 變數的類型：
JavaScript 是一種弱類型的語言，因此變數的類型由賦值號右邊的資料所決定。
JavaScript 運算子
算術運算子：+ – * / % ++ -- ，其中+號還被重載用於拼接字串，另外，任何類型+上字串都是字串。
賦值運算子：= += -= *= /= %=
比較子：== === != > < >= <=
邏輯運算子：&& || !
條件運算子：？ :
JavaScript 分支語句
傳統的 if 。。else，if 。。else if 。。else 的嵌套都是可行的。
switch（n）中的 n 可以是運算式，但通常是變數，case 結構中也需要使用 break 分隔。
JavaScript 訊息框
可以在 JavaScript 中建立三種訊息框：警告框、確認框、提示框。
警告框經常用於確保使用者可以得到某些資訊。當警告框出現後，使用者需要點擊確定按鈕才能繼續進行操作。
alert("文本")
確認框用於使使用者可以驗證或者接受某些資訊。當確認框出現後，使用者需要點擊確定或者取消按鈕才能繼續進行操作。如果使用者點擊確認，那麼傳回值為 true。如果使用者點擊取消，那麼傳回值為 false。
confirm("文本")
提示框經常用於提示使用者在進入頁面前輸入某個值。當提示框出現後，使用者需要輸入某個值，然後點擊確認或取消按鈕才能繼續操縱。如果使用者點擊確認，那麼傳回值為輸入的值。如果使用者點擊取消，那麼傳回值為 null。
prompt("文本","預設值")
JavaScript 函數
將指令碼編寫為函數，就可以避免頁面載入時執行該指令碼。函數包含著一些代碼，這些代碼只能被事件啟用，或者在函數被調用時才會執行。你可以在頁面中的任何位置呼叫指令碼（如果函數嵌入一個外部的 .js 檔案，那麼甚至可以從其他的頁面中調用）。
建議將函數在頁面起始位置定義，即 <head> 部分。
建立函數的文法：function 函數名() { 代碼．．． }
function 函數名(var1,var2,...,varX) { 代碼．．． }
JavaScript 變數的生存期
當您在函數內聲明了一個變數後，就只能在該函數中訪問該變數。當退出該函數後，這個變數會被撤銷。這種變數稱為本地變數。您可以在不同的函數中使用名稱相同的本地變數，這是因為只有聲明過變數的函數能夠識別其中的每個變數。
如果您在函數之外聲明了一個變數，則頁面上的所有函數都可以訪問該變數。這些變數的生存期從聲明它們之後開始，在頁面關閉時結束。
JavaScript 迴圈
在編寫代碼時，你常常希望反覆執行同一段代碼。我們可以使用迴圈來完成這個功能，這樣就用不著重複地寫若干行相同的代碼。
JavaScript 有兩種（也只有2種）不同種類的迴圈：
文法格式和java或.NET是一樣的。
使用什麼語句可以直接跳出多重迴圈？
continue 語句可以在符合一定的條件下結束本輪迴圈，直接進行下一輪迴圈。
break 語句可以在符合一定的條件下直接結束迴圈，代碼會跳轉到迴圈外靠後的最近一條語句繼續向下執行。
在 .NET 中，goto 語句可以直接定位到指定的標記為繼續執行代碼，而 javascript 中是沒有 goto 語句的，那麼怎麼直接跳出多重迴圈呢？
看下面的樣本：
outerloop: // 命名外圈語句
for(var i=0; i<10; i++)
{
innerloop://命名內圈語句
for(var j=0; j<10; j++)
{
// 跳出內圈迴圈
if(j>3){break;}
// 跳出內圈迴圈
if(i==2){break innerloop;}
// 跳出外圈迴圈
if(i==4){break outerloop;}
document.write("i = "+i+" , j = "+j+"<br />");
}
}
document.write("final"+" i = "+i+" , j = "+j);
可以在迴圈外設定標記為，然後使用 break 或 continue 加上標記名直接跳出迴圈。這裡要注意，和其他語言不同，JS中一旦跳出，程式是不會繼續從標記位處再度往下執行代碼的，而是直接執行最外層迴圈之後的 code，如果後面沒有 code，那麼程式就此結束。
JavaScript For...In 聲明
For...In 聲明用於遍曆數組或者對象的屬性（對數組或者對象的屬性進行迴圈操作）。[也是 for 迴圈家族的一員]
下例是使用 for..in 遍曆一個數組對象，注意這裡 .NET 中 foreach 的區別。
var x
var mycars = new Array();
mycars[0] = "Saab";
mycars[1] = "Volvo";
mycars[2] = "BMW";
for (x in mycars)
{
document.write(mycars[x] + "<br />");
}
JavaScript 事件
事件是可以被 JavaScript 偵測到的行為。
JavaScript 使我們有能力建立動態網頁面。事件是可以被 JavaScript 偵測到的行為。
網頁中的每個元素都可以產生某些可以觸發 JavaScript 函數的事件。比方說，我們可以在使用者點擊某按鈕時產生一個 onClick 事件來觸發某個函數。事件在 HTML 頁面中定義。
事件舉例：注意：事件通常與函數配合使用，當事件發生時函數才會執行。
onload 和 onUnload
當使用者進入或離開頁面時就會觸發 onload 和 onUnload 事件。onload 事件常用來檢測訪問者的瀏覽器類型和版本，然後根據這些資訊載入特定版本的網頁。onload 和 onUnload 事件也常被用來處理使用者進入或離開頁面時所建立的 cookies。例如，當某使用者第一次進入頁面時，你可以使用訊息框來詢問使用者的姓名。姓名會儲存在 cookie 中。當使用者再次進入這個頁面時，你可以使用另一個訊息框來和這個使用者打招呼："Welcome John Doe!"。
onFocus, onBlur 和 onChangeonFocus、onBlur 和 onChange 事件通常相互配合用來驗證表單。
下面是一個使用 onChange 事件的例子。使用者一旦改變了域的內容，checkEmail() 函數就會被調用。
<input type="text" size="30" id="email" onchange="checkEmail()"> onSubmit
onSubmit 用於在提交表單之前驗證所有的表單域。
下面是一個使用 onSubmit 事件的例子。當使用者單擊表單中的確認按鈕時，checkForm() 函數就會被調用。假若域的值無效，此次提交就會被取消。checkForm() 函數的傳回值是 true 或者 false。如果傳回值為true，則提交表單，反之取消提交。
<form method="post" action="xxx.htm" onsubmit="return checkForm()">
onMouseOver 和 onMouseOut
onMouseOver 和 onMouseOut 用來建立“動態”按鈕。
下面是一個使用 onMouseOver 事件的例子。當 onMouseOver 事件被指令碼偵測到時，就會彈出一個警告框：
<a href="http://www.w3school.com.cn" onmouseover="alert(‘An onMouseOver event‘);return false"><img src="w3school.gif" width="100" height="30"></a>
JavaScript Try...Catch 語句JavaScript - 捕獲錯誤
當我們在網上衝浪時，總會看到帶有 runtime 錯誤的 Javascript 警告框，同時會詢問我們“是否進行 debug？”。像這樣的錯誤資訊或許對開發人員有用，對使用者則未必。當錯誤發生時，他們往往會選擇離開這個網站。
有兩種在網頁中捕獲錯誤的方法：
注意：chrome、opera 和 safari 瀏覽器不支援 onerror 事件。【不建議使用此方式】
下一個例子會顯示一個確認框，讓使用者來選擇在發生錯誤時點擊確定按鈕來繼續瀏覽網頁，還是點擊取消按鈕來回到首頁。
<html>
<head>
<script type="text/javascript">
var txt=""
function message()
{
try
{
adddlert("Welcome guest!");
}
catch(err)
{
txt = "There was an error on this page.\n\n";
txt += "Click OK to continue viewing this page,\n";
txt += "or Cancel to return to the home page.\n\n";
if(!confirm(txt))
{
document.location.href="http://www.w3school.com.cn/";
}
}
}
</script>
</head>
<body>
<input type="button" value="View message" onclick="message()" />
</body>
</html>
JavaScript Throw 聲明
throw 聲明的作用是建立 exception（異常）。你可以把這個聲明與 try...catch 聲明配合使用，以達到控製程序流併產生精確錯誤訊息的目的。
下面的執行個體的作用是測定變數 x 的值。如果 x 的值大於 10 或者小於 0，錯誤就會被拋出 (throw)。這個錯誤被 catch 的參數捕獲後，就會顯示出自訂的出錯資訊。
<html>
<body>
<script type = "text/javascript">
var x = prompt("Enter a number between 0 and 10:","");
try
{
if(x>10)
throw "Err1";
else if(x<0)
throw "Err2";
}
catch(er)
{
if(er == "Err1")
alert("Error! The value is too high");
if(er == "Err2")
alert("Error! The value is too low");
}
</script>
</body>
</html>
JavaScript 特殊字元
你可以在 JavaScript 中使用反斜線來向文本字串添加特殊字元。
反斜線用來在文本字串中插入省略符號、分行符號、引號和其他特殊字元。
請看下面的 JavaScript 代碼：
var txt="We are the so-called "Vikings" from the north."document.write(txt)
在 JavaScript 中，字串使用單引號或者雙引號來起始或者結束。這意味著上面的字串將被截為：We are the so-called。
要解決這個問題，就必須把在 "Viking" 中的引號前面加上反斜線 (\)。這樣就可以把每個雙引號轉換為字面上的字串。
var txt="We are the so-called \"Vikings\" from the north."document.write(txt)
現在 JavaScript 就可以輸出正確的文本字串了：We are the so-called "Vikings" from the north。
JavaScript 指導方針JavaScript 對大小寫敏感
名為 "myfunction" 的函數和名為 "myFunction" 的函數是兩個不同的函數，同樣，變數 "myVar" 和變數 "myvar" 也是不同的。JavaScript 對大小寫敏感 - 所以當您建立或使用變數、對象及函數時，請注意字元的大小寫。
空格
JavaScript 會忽略多餘的空格。所以您可以在代碼中添加適當的空格，使得代碼的可讀性更強。下面的兩行是等效的：
name="Hege"name = "Hege"
換行
您可以在文本字串內部使用反斜線對代碼進行折行。下面的例子是正確的：
document.write("Hello World!")
但是不能像這樣折行：
document.write ("Hello World!")
JavaScript 之基礎知識
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
