javascript 基本用法
阿新 • • 發佈：2018-11-10
1.javascript簡介 *基於物件和事件驅動的語言，應用於客戶端 -基於物件 提供了很多物件，可以直接拿過來使用 -事件驅動 html做網站靜態效果，javascript能夠呈現動態效果 -客戶端：專門指瀏覽器 js的特點 (1)互動性 -資訊的動態互動 (2)安全性 -js不能訪問本地磁碟的檔案 (3)跨平臺性 -只要支援js的瀏覽器，都可以執行 javascript的組成 三部分 (1)ECMAScript -ECMA 歐洲計算機協會 -由ECMA組織制定的js語法，語句。。。。 (2)BOM -broswer object model:瀏覽器物件模型 (3)DOM -document object model:文件物件模型 (對網頁文字內容進行操作) 2.js和html的結合方式 第一種： -使用標籤 <script type="text/javascript">script程式碼</script> 第二種： -使用script標籤，引入一個外部的js檔案 **建立js檔案，寫入js程式碼 <body> <script type="text/javascript" src="1.js"></script> </body> **使用第二種方式時，在<script>裡面寫內容不會生效 ，需要在js檔案寫內容才能生效。 3.js的原始型別和宣告變數 java的基本資料型別 byte short int long float double char boolean 定義變數 都是用關鍵字 var js的原始型別五個 - string：表示字串 var str ="abc"; - number：數字型別 var m =123; - boolean：true和false var flag = true; - null var date = new date(); 獲取物件的引用，null表示物件引用為空，所有物件的引用也是object - undifined 定義一個變數，沒有賦值 var aa; typeof();檢視當前變數的資料型別 <!DOCTYPE html> <html> <head> <title>js的資料型別.html</title> </head> <body> <script type="text/javascript"> //定義一個字串 var str = "abc"; //alert(str); alert(typeof(str)) //定義一個數字 //var m = 123; //alert(m); //定義bollean型別 //var flag = true; //alert(flag); </script> </body> </html> 4.js的語句 -java裡面的語句： if判斷 for迴圈 switch -js語句 if判斷 switch語句 <!DOCTYPE html> <html> <head> <title>js語句l.html</title> </head> <body> <script type="text/javascript"> //if語句 /* var a = 5; if(a==5){ alert("5"); }else{ alert("6"") } */ //swith語句 /* var b = 6; switch(b){ case 3: alert("3"); bleak; case 6: alert("6"); bleak; default: alert("others""); } */ //while迴圈 /* var i =5; while(i>1){ alert(i); i--; } */ //for迴圈 for(var m=0;m<=5;i++){ alert(m); } </script> </body> </html> 5.js的運算子 js中不區分整數和小數 <script type="text/javascript"> var j = 123; alert(j/1000*1000); //在java裡面得到的結果是0； //在js裡面不分整數和小數 ，得到的結果是123 </script> 字串的相加和相減的操作： 如果是相加得到是字串連線 如果相減得到是相減的運算 如果不是數字會提示nan錯誤 var str ="456"; alert(str+1);//在java和js裡面都是4561 alert(str-1);//得到 455 bollean操作 var flag=true; true=1 alert(flag+1); var flag1=false; false=0 alert(flag+1); == 和===區別 ==比較的是值 ===比較的是值和型別 引入的知識 直接向頁面輸出的語句(可以把內容顯示在壓面上) *document。write("aaa"); document。write可以輸出變數還可以輸出html程式碼 案例：乘法表練習 <!DOCTYPE html> <html> <head> <title>乘法表練習.html</title> </head> <body> <script type="text/javascript"> document.write("<table border='1' border-coler:blue>"); for (var i=1;i<=9;i++){ document.write("<tr>"); for (var j=1;j<=i;j++){ document.write("<td>"); document.write(j+"*"+i+"="+i*j + " "); document.write("<td/>"); } //document.write("<br/>"); document.write("</tr>"); } document.write("</table>"); </script> </body> </html>
7.js的陣列 定義方式(三種) 第一種 var arr = [1,2,3] var arr = [1,2,"3"] 第二種 var arr1 = new Array(5);定義陣列長度為5 arr1[0] = "1"; 第三種:使用內建物件Array： var arr2 = new Array(3,4,5);定義一個數組 數組裡面有一個屬性length，可獲取陣列的長度 陣列可以存放不同資料型別的資料。 8.js的函式 js裡面定義函式(方法)有三種方式： 第一種方式： ***使用關鍵字 function function 方法名(引數列表){ 方法體 返回值可有可無 } 程式碼 <script type="text/javascript"> //第一種方式建立 function test(){ alert("qwert"); } //呼叫方法 //test(); function add(a,b){ var sum = a+b; alert(sum); } add(1,2); function add2(a,b,c){ var sum = a+b+c; return sum } alert(add2(3,4,5)); </script> 第二種方式： 匿名函式 var add= function(引數列表){ 方法體和返回值 } 程式碼： <script type="text/javascript"> //第二種方法 var add = function(m.n){ alert(m+n) } //呼叫方法 add(2,3) </script> 第三種方式(用的少，瞭解) 動態函式 使用到js裡面的一個內建物件Function var add = new Function("引數列表","方法體和返回值"); 程式碼： var add4 = new Function("x,y","var sum;sum=x+y;return sum") alert(add4(2,5)); 9.js的全域性變數和區域性變數 全域性變數：在<script>中定義，可以在全域性使用 區域性變數：只能在方法體的內部使用 10.script標籤的位置存放 建議將script標籤放在</body>後面 如果現在有這麼個需求： 在js裡面需要獲取input裡面的值，如果把script標籤放在head裡面會出現問題 html解析是從上往下解析的，script標籤放到的是head裡面，直接在裡面取input裡面的值，因為頁面還沒有解析到input哪一行，肯定取不到的。 11.js的過載 什麼是過載？方法名相同，引數列表不同