簡介:JavaScript 是腳本語言,是一種輕量級的編程語言,是可插入 HTML 頁面的編程代碼, 插入 HTML 頁面后,可由所有的現(xiàn)代瀏覽器執(zhí)行。
1. JavaScript:寫入 HTML 輸出 ? document.write("<h1>This is a heading </h1>");
提示:您只能在 HTML 輸出中使用 document.write。如果您在文檔加載后使用該方法,會覆蓋整個文檔。
2.JavaScript:對事件作出反應(yīng) <button type="button" ?onclick="alert('歡迎')">點(diǎn)擊這里</button>
alert() 函數(shù)在 JavaScript 中并不常用,但它對于代碼測試非常方便
3.JavaScript:改變 HTML 內(nèi)容 ? ?x=document.getElementById("demo") ?//查找元素
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? x.innerHTML="Hello JavaScript";//改變元素
4.JavaScript:改變 HTML 樣式 ? ? x=document.getElementById("demo") ?//找到元素
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? x.style.color="#ff0000"; ? ? ? ? ? //改變樣式
5.JavaScript:驗(yàn)證輸入 ? ? ? ? ?if isNaN(x) {alert("Not Numeric")};
提示:JavaScript 由 Brendan Eich 發(fā)明。它于 1995 年出現(xiàn)在 Netscape 中(該瀏覽器已停止更新),并于 1997 年被 ECMA(一個標(biāo)準(zhǔn)協(xié)會)采納。
JavaScript的使用 ?
HTML 中的腳本必須位于<script>與</script>標(biāo)簽之間。腳本可被放置在 HTML 頁面的<body> 和 <head>部分中。
1.JavaScript 語句 ? JavaScript 語句向?yàn)g覽器發(fā)出的命令。語句的作用是告訴瀏覽器該做什么。
分號用于分隔 JavaScript 語句,通常我們在每條可執(zhí)行的語句結(jié)尾添加分號,使用分號的另一用處是在一行中編寫多條語句。提示:您也可能看到不帶有分號的案例,在 JavaScript 中,用分號來結(jié)束語句是可選的
2.JavaScript 代碼塊,JavaScript 語句通過代碼塊的形式進(jìn)行組合,塊由左花括號開始,由右花括號結(jié)束。
塊的作用是使語句序列一起執(zhí)行。
3.JavaScript 對大小寫敏感。
當(dāng)編寫 JavaScript 語句時,請留意是否關(guān)閉大小寫切換鍵。函數(shù) getElementById 與 getElementbyID 是不同的,同樣,變量 myVariable 與 MyVariable 也是不同的。
4.對代碼行進(jìn)行折行 ? 您可以在文本字符串中使用反斜杠對代碼行進(jìn)行換行。下面的例子會正確地顯示:
document.write("Hello \\
World!");
提示:JavaScript 是腳本語言。瀏覽器會在讀取代碼時,逐行地執(zhí)行腳本代碼。而對于傳統(tǒng)編程來說,會在執(zhí)行前對所有代碼進(jìn)行編譯。
5.JavaScript 不會執(zhí)行注釋。我們可以添加注釋來對 JavaScript 進(jìn)行解釋,或者提高代碼的可讀性。
單行注釋以 // 開頭。 ?多行注釋以 /* 開始,以 */ 結(jié)尾。
6.JavaScript 變量 ?(1)變量必須以字母開頭 ?(2)變量也能以 $ 和 _ 符號開頭(不過我們不推薦這么做)
(3)變量名稱對大小寫敏感(y 和 Y 是不同的變量)
7.聲明(創(chuàng)建) JavaScript 變量 ? var 變量名 ? ?例如: var carname;
8.一條語句,多個變量 ?您可以在一條語句中聲明很多變量。該語句以 var 開頭,并使用逗號分隔變量即可:
var name="Gates", age=56, job="CEO";聲明也可橫跨多行。
9.JavaScript 數(shù)據(jù)類型 ? ?字符串、數(shù)字、布爾、數(shù)組、對象、Null、Undefined
JavaScript 擁有動態(tài)類型。這意味著相同的變量可用作不同的類型。
字符串可以是引號中的任意文本。您可以使用單引號或雙引號。
JavaScript 只有一種數(shù)字類型。數(shù)字可以帶小數(shù)點(diǎn),也可以不帶。
avaScript 布爾(邏輯)只能有兩個值:true 或 false。
10.JavaScript 對象由花括號分隔。在括號內(nèi)部,對象的屬性以名稱和值對的形式 (name : value) 來定義。屬性由逗號分隔: ?var person={firstname:"Bill", lastname:"Gates", id:5566};
對象屬性有兩種尋址方式:name=person.lastname; ?name=person["lastname"];
11.聲明變量類型
當(dāng)您聲明新變量時,可以使用關(guān)鍵詞 "new" 來聲明其類型:
var carname=new String;
var x= ? ? ?new Number;
var y= ? ? ?new Boolean;
var cars= ? new Array;
var person= new Object;
JavaScript 變量均為對象。當(dāng)您聲明一個變量時,就創(chuàng)建了一個新的對象。
JavaScript 對象
JavaScript 中的所有事物都是對象:字符串、數(shù)字、數(shù)組、日期,等等,在 JavaScript 中,對象是擁有屬性和方法的數(shù)據(jù)。
1.屬性和方法 ? 屬性是與對象相關(guān)的值;方法是能夠在對象上執(zhí)行的動作。(點(diǎn)語法)
屬性:car.name=Fiat ? 方法:car.start()
2.JavaScript函數(shù)是由事件驅(qū)動的或者當(dāng)它被調(diào)用時執(zhí)行的可重復(fù)使用的代碼塊。
函數(shù)就是包裹在花括號中的代碼塊,前面使用了關(guān)鍵詞 function:
function functionname()
{ ?這里是要執(zhí)行的代碼 ?} ? ? 當(dāng)調(diào)用該函數(shù)時,會執(zhí)行函數(shù)內(nèi)的代碼。
可以在某事件發(fā)生時直接調(diào)用函數(shù)(比如當(dāng)用戶點(diǎn)擊按鈕時),并且可由 JavaScript 在任何位置進(jìn)行調(diào)用。
提示:JavaScript 對大小寫敏感。關(guān)鍵詞 function 必須是小寫的,并且必須以與函數(shù)名稱相同的大小寫來調(diào)用函數(shù)。
例如: function myFunction() ? ? ? {alert("Hello World!");}
您可以發(fā)送任意多的參數(shù),由逗號 (,) 分隔:myFunction(argument1,argument2)
當(dāng)您聲明函數(shù)時,請把參數(shù)作為變量來聲明:function myFunction(var1,var2) ? ?{ ?這里是要執(zhí)行的代碼 ?}
變量和參數(shù)必須以一致的順序出現(xiàn)。第一個變量就是第一個被傳遞的參數(shù)的給定的值,以此類推。
帶有返回值的函數(shù) ? ?有時,我們會希望函數(shù)將值返回調(diào)用它的地方。
通過使用 return 語句就可以實(shí)現(xiàn)。在使用 return 語句時,函數(shù)會停止執(zhí)行,并返回指定的值。
語法 ? function myFunction() ? ? ?{var x=5;return x;}
3.
局部 JavaScript 變量 在 JavaScript 函數(shù)內(nèi)部聲明的變量(使用 var)是局部變量,所以只能在函數(shù)內(nèi)部訪問它。(該變量的作用域是局部的)。
您可以在不同的函數(shù)中使用名稱相同的局部變量,因?yàn)橹挥新暶鬟^該變量的函數(shù)才能識別出該變量。
只要函數(shù)運(yùn)行完畢,本地變量就會被刪除。
全局 JavaScript 變量
在函數(shù)外聲明的變量是全局變量,網(wǎng)頁上的所有腳本和函數(shù)都能訪問它。
JavaScript 變量的生存期
JavaScript 變量的生命期從它們被聲明的時間開始。
局部變量會在函數(shù)運(yùn)行以后被刪除。
全局變量會在頁面關(guān)閉后被刪除。
4.JavaScript 算術(shù)運(yùn)算符
算術(shù)運(yùn)算符用于執(zhí)行變量與/或值之間的算術(shù)運(yùn)算。
JavaScript 賦值運(yùn)算符
賦值運(yùn)算符用于給 JavaScript 變量賦值。
5. ?用于字符串的 + 運(yùn)算符
+ 運(yùn)算符用于把文本值或字符串變量加起來(連接起來)。
如需把兩個或多個字符串變量連接起來,請使用 + 運(yùn)算符。
txt1="What a very";
txt2="nice day";
txt3=txt1+txt2;
在以上語句執(zhí)行后,變量 txt3 包含的值是 "What a verynice day"。 ?空格自己可以加。
6.JavaScript 比較和邏輯運(yùn)算符 ? ? 比較和邏輯運(yùn)算符用于測試 true 或 false。
比較運(yùn)算符在邏輯語句中使用,以測定變量或值是否相等。
邏輯運(yùn)算符用于測定變量或值之間的邏輯。
條件運(yùn)算符 ? JavaScript 還包含了基于某些條件對變量進(jìn)行賦值的條件運(yùn)算符。
7.JavaScript If...Else 語句 ? ? ?條件語句用于基于不同的條件來執(zhí)行不同的動作。
條件語句
通常在寫代碼時,您總是需要為不同的決定來執(zhí)行不同的動作。您可以在代碼中使用條件語句來完成該任務(wù)。
在 JavaScript 中,我們可使用以下條件語句:
if 語句 - 只有當(dāng)指定條件為 true 時,使用該語句來執(zhí)行代碼
if...else 語句 - 當(dāng)條件為 true 時執(zhí)行代碼,當(dāng)條件為 false 時執(zhí)行其他代碼
if...else if....else 語句 - 使用該語句來選擇多個代碼塊之一來執(zhí)行
switch 語句 - 使用該語句來選擇多個代碼塊之一來執(zhí)行
If 語句 ?只有當(dāng)指定條件為 true 時,該語句才會執(zhí)行代碼。
語法 ? ?if (條件) ?{ ?只有當(dāng)條件為 true 時執(zhí)行的代碼 ? }
注意:請使用小寫的 if。使用大寫字母(IF)會生成 JavaScript 錯誤!
If...else 語句
請使用 if....else 語句在條件為 true 時執(zhí)行代碼,在條件為 false 時執(zhí)行其他代碼。
語法 ? ?if (條件) ? ?{ ?當(dāng)條件為 true 時執(zhí)行的代碼 }
else ?{ ?當(dāng)條件不為 true 時執(zhí)行的代碼 ?}
If...else if...else 語句 ? ? ? ?使用 if....else if...else 語句來選擇多個代碼塊之一來執(zhí)行。
語法 ? if (條件 1) ? { 當(dāng)條件 1 為 true 時執(zhí)行的代碼 ?}
else if (條件 2) ?{ ? 當(dāng)條件 2 為 true 時執(zhí)行的代碼 ?}
else ? { ?當(dāng)條件 1 和 條件 2 都不為 true 時執(zhí)行的代碼 ?}
8.switch 語句用于基于不同的條件來執(zhí)行不同的動作。
JavaScript Switch 語句 ? 請使用 switch 語句來選擇要執(zhí)行的多個代碼塊之一。
語法 ?switch(n){ ?
case 1: ? ?執(zhí)行代碼塊 1 ? ? ? ? ? ? break;
case 2: ? ?執(zhí)行代碼塊 2 ? ? ? ? ? ? break;
default: ? ? ? ? ?n 與 case 1 和 case 2 不同時執(zhí)行的代碼 ? ? ? ? }
請注意 ?default ?這個關(guān)鍵字
9.JavaScript For 循環(huán) ? ? ? ? ?循環(huán)可以將代碼塊執(zhí)行指定的次數(shù)。
JavaScript 支持不同類型的循環(huán):
for - 循環(huán)代碼塊一定的次數(shù)
for/in - 循環(huán)遍歷對象的屬性
while - 當(dāng)指定的條件為 true 時循環(huán)指定的代碼塊
do/while - 同樣當(dāng)指定的條件為 true 時循環(huán)指定的代碼塊
(1) For 循環(huán)
下面是 for 循環(huán)的語法:
for (語句 1; 語句 2; 語句 3)
{ ? 被執(zhí)行的代碼塊 }
語句 1 在循環(huán)(代碼塊)開始前執(zhí)行
語句 2 定義運(yùn)行循環(huán)(代碼塊)的條件
語句 3 在循環(huán)(代碼塊)已被執(zhí)行之后執(zhí)行
(2)For/In 循環(huán)
JavaScript ? for/in 語句循環(huán)遍歷對象的屬性:例如:
var person={fname:"John",lname:"Doe",age:25};
for (x in person)
{ ? txt=txt + person[x]; ?} ?結(jié)果第這樣的:JohnDoe25
(3)while 循環(huán)會在指定條件為真時循環(huán)執(zhí)行代碼塊。
語法 ? ? ?while (條件) ? ? ? ?{需要執(zhí)行的代碼}
(4)do/while 循環(huán) 是 while 循環(huán)的變體。該循環(huán)會執(zhí)行一次代碼塊,在檢查條件是否為真之前,然后如果條件為真的話,就會重復(fù)這個循環(huán)。
語法 ? do
? ? ? ? { 需要執(zhí)行的代碼 ?}
? ? ? ? while (條件);
10 . JavaScript Break 和 Continue 語句
? ?break 語句用于跳出循環(huán),continue 用于跳過循環(huán)中的一個迭代。
Break 語句 ? 它用于跳出 switch() 語句,break 語句可用于跳出循環(huán)。
Continue 語句中斷循環(huán)中的迭代,如果出現(xiàn)了指定的條件,然后繼續(xù)循環(huán)中的下一個迭代。
例子跳過了值 3:實(shí)例for (i=0;i<=10;i++) { if (i==3) continue; ?x=x + "The number is " + i + "<br>"; ?}
11. JavaScript 錯誤 - Throw、Try 和 Catch
try 語句測試代碼塊的錯誤。
catch 語句處理錯誤。
throw 語句創(chuàng)建自定義錯誤。
錯誤一定會發(fā)生
當(dāng) JavaScript 引擎執(zhí)行 JavaScript 代碼時,會發(fā)生各種錯誤:
可能是語法錯誤,通常是程序員造成的編碼錯誤或錯別字。
可能是拼寫錯誤或語言中缺少的功能(可能由于瀏覽器差異)。
可能是由于來自服務(wù)器或用戶的錯誤輸出而導(dǎo)致的錯誤。
當(dāng)然,也可能是由于許多其他不可預(yù)知的因素。
JavaScript 測試和捕捉
try 語句允許我們定義在執(zhí)行時進(jìn)行錯誤測試的代碼塊。
catch 語句允許我們定義當(dāng) try 代碼塊發(fā)生錯誤時,所執(zhí)行的代碼塊。
JavaScript 語句 try 和 catch 是成對出現(xiàn)的。
語法 ?try ? ? ? 重點(diǎn)
{ ? //在這里運(yùn)行代碼 ? ?}
catch(err)
{ ?//在這里處理錯誤 ?}
Throw 語句
throw 語句允許我們創(chuàng)建自定義錯誤。
正確的技術(shù)術(shù)語是:創(chuàng)建或拋出異常(exception)。
如果把 throw 與 try 和 catch 一起使用,那么您能夠控制程序流,并生成自定義的錯誤消息。
語法
throw exception
異常可以是 JavaScript 字符串、數(shù)字、邏輯值或?qū)ο?/p>
12. JavaScript 表單驗(yàn)證 ?可用來在數(shù)據(jù)被送往服務(wù)器前對 HTML 表單中的這些輸入數(shù)據(jù)進(jìn)行驗(yàn)證
被 JavaScript 驗(yàn)證的這些典型的表單數(shù)據(jù)有:
(1)用戶是否已填寫表單中的必填項(xiàng)目?
(2)用戶輸入的郵件地址是否合法?
(3)用戶是否已輸入合法的日期?
(4)用戶是否在數(shù)據(jù)域 (numeric field) 中輸入了文本?
下面的函數(shù)用來檢查用戶是否已填寫表單中的必填(或必選)項(xiàng)目。假如必填或必選項(xiàng)為空,那么警告框會彈出,并且函數(shù)的返回值為 false,否則函數(shù)的返回值則為 true(意味著數(shù)據(jù)沒有問題):
function validate_required(field,alerttxt)
{
with (field)
{
? if (value==null||value=="")
? {alert(alerttxt);return false}
? else {return true}
} ? ? ? }
請參考以下鏈接代碼 ?驗(yàn)證代碼