JavaScript流程式控制制語句與函數
- 2019 年 12 月 24 日
- 筆記
本文目錄
流程式控制制語句
函數綁定事件：方法一綁定事件：方法二參考
流程式控制制語句
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>流程式控制制語句</title> </head> <body> <script type="text/javascript"> // break : 跳出循環 // continue : 跳過本次循環 outer: for(var i = 0; i < 10; i++) { for(var j = 0; j < 10; j++) { if(i == 5 && j == 5) { break outer; } document.write("i:" + i + ",j:" + j ) } document.write("<br/>") } var a = 3; switch(a) { case 1: document.write("周1"); break; case 2: document.write("周2"); break; case 3: document.write("周3"); break; case 4: document.write("周4"); break; case 5: document.write("周5"); break; case 6: document.write("周6"); break; case 7: document.write("周7"); break; default: document.write("出錯了"); break; } if(a == 1) { document.write("周1"); } else if(a == 2) { document.write("周2"); } else if(a == 3) { document.write("周3"); } else if(a == 4) { document.write("周4"); } else if(a == 5) { document.write("周5"); } else if(a == 6) { document.write("周6"); } else if(a == 7) { document.write("周7"); } else { document.write("出錯了"); } </script> </body> </html>函數
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <script type="text/javascript"> // 無參無返回值的函數 function fn1() { document.write("無參無返回值的函數") } // 有參無返回值的函數 function fn2(a, b) { document.write("有參無返回值的函數:a:" + a + ",b:" + b) } // 無參有返回值的函數 function fn3() { return 2; } // 有參有返回值的函數 function fn4(a, b) { return a + b; } // 調用函數 // fn1(); // fn2(1, "3"); var result = fn4(2,3) console.log(result) </script> </body> </html>綁定事件：方法一
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> <script type="text/javascript"> function login() { document.write("登錄成功") } </script> <!-- 函數綁定的第一種方式 : 使用屬性 在標籤中聲明 對應的事件屬性 onclick = "方法名()" --> <input type="button" value="登錄" onclick="login()" /> </body> </html>綁定事件：方法二
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> // 監聽頁面載入完成的事件 window.onload = function() { // 1. 查找元素 var id_input = document.getElementById("id_input"); // 2. 派發事件 id_input.onclick = function() { document.write("登錄成功") } } </script> </head> <body> <input type="button" value="登錄" id="id_input" /> <!-- 函數綁定的第二種方式 : 事件的派發 HTML程式碼執行的順序 : 從上往下,從左往右 --> </body> </html>
