b8: Tự học javascript căn bản bài 1Cần lưu ý tại bài học: document.write('Nội dung cần in'); // in nội dung ra ngoài màn hình. var a=prompt("Nội dung hiển thị ngoài màn hình",''); // tạo khung textbox cho người dùng nhập vào. Dữ liệu nhập vào sẽ được truyền cho biến a. var b=parseInt(prompt("Nhập tuổi của bạn",'')); // nhập vào giá trị, giá trị được truyền vào biến b, biến b sẽ được hàm parseInt chuyển thành kiểu số thực int. var laygiatri=confirm("Bạn chọn Ok hay Cancal"); // tạo hộp thoại OK, Cancel và trả về giá trị cho biến laygiatri. alert(laygiatri); // in dữ liệu biến laygiatri ra màn hình. Các phép toán trong javascript Các phép toán trong javascript : +, -, *, /, % Các phép quan hệ so sánh: >, < , >=, <=, ==, != Các phép logic : && (and), || (or), ! (not, phủ định) Demo online: xem demo tại đây tự học javascript bài 1. Code : Trong code đã được ghi chú khá rõ, các bạn đọc code sẽ hiểu rõ hơn. HTML: <!doctype html> <html> <head> <meta charset="utf-8"> <title>Bai 8: Học javascript căn bản bài 1</title> <meta name="description" content="Bai 8: Học javascript căn bản bài 1, Học javascript căn bản bài 1, Học javascript căn bản bài 1" > </head> <body> <h1 align="center">Bai 8: Học javascript căn bản bài 1</h1> <!-- start code javascript --> <script type="text/javascript"> document.write("<p alighn='center'>Hello <b>Javascript</b></p>"); /* lệnh document.write('text'): xuất ra dạng text dạng html trên trình duyệt */ document.write("<p>Đoạn văn chứa nội dung</p>"); // Start tạo bảng trong javascript document.write("<table width='600' border='1' align='center' cellpadding='5'><caption>Tạo Bảng Bằng Javascript</caption>"); document.write("<tr><th width='300' height='40'>Tên</th> <th>Tuổi</th> </tr>"); document.write("<tr><td align='center'>Tí</td><td align='center'>19</td></tr>"); document.write("</table>"); // Ennd tạo bảng trong javascript //START Biến trong javascript //có dữ liệu thì không cần khai báo trước. a=10; b=5; c='hello'; //không có dữ liệu thì dùng biến var để khai báo kèm theo var d; //xuất biến ra ngoài và nối chuỗi trong javascript document.write("Giá trị biến a :<b>"+a+"</b>"); //END Biến trong javascript /*START Các phép toán trong javascript : +, -, *, /, % Các phép quan hệ so sánh: >, < , >=, <=, ==, != Các phép logic : && (and), || (or), ! (not, phủ định) */ d=a+b; document.write("<br>"+d); //END Các phép toán trong javascript // START Bài tập tạo bảng bằng các phép toán dd=a/b; document.write("<table width='750' border='1' align='center' cellpadding='5'><caption>Bài tập tạo bảng bằng các phép toán</caption>"); document.write("<tr><th width='150' height='40'></th> <th>+</th> <th>-</th> <th>*</th> <th>/</th></tr>"); document.write("<tr><td align='center'>a = "+a+"</td><td align='center' rowspan='2'>"+(a+b)+"</td> <td align='center' rowspan='2'>"+(a-b)+"</td> <td align='center' rowspan='2'>"+(a*b)+"</td> <td align='center' rowspan='2'>"+ dd+" </td> </tr>"); document.write("<tr><td align='center'>b = "+b+"</td></tr>"); document.write("</table>"); // END Bài tập tạo bảng bằng các phép toán // Start Tạo hộp thoại thông báo alert, tạo hộp thoại prompt alert("Nội dung thông báo biến a: "+a); a=prompt("Nhập giá trị a mới",a); // kết quả trả về của hàm prompt là chuỗi alert("Giá trị a mới vừa nhập là: "+a); // END Tạo hộp thoại thông báo alert, tạo hộp thoại prompt //Hàm chuyển chuỗi thành số tam=parseInt("12");//parseFloat(), isNaN // Satrt hộp thoại confirm laygiatri=confirm("Bạn chọn Ok hay Cancal"); alert(laygiatri); // End hộp thoại confirm //Bài tập // Start tạo bảng trong javascript nhập từ hộp thoại a=prompt("Nhập tên của bạn",''); b=parseInt(prompt("Nhập tuổi của bạn",'')); document.write("<br> <br> <table width='600' border='1' align='center' cellpadding='5'><caption>Tạo Bảng Bằng Javascript nhập từ hộp thoại</caption>"); document.write("<tr><th width='300' height='40'>Tên</th> <th>Tuổi</th> </tr>"); document.write("<tr><td align='center'>"+a+"</td><td align='center'>"+b+"</td></tr>"); document.write("</table>"); // Ennd tạo bảng trong javascript nhập từ hộp thoại // START Bài tập tạo bảng bằng các phép toán do người dùng nhập vào các con số a=parseInt(prompt("Nhập giá trị a",'')); b=parseInt(prompt("Nhập giá trị b",'')); ab=a/b; document.write("<br> <br> <table width='750' border='1' align='center' cellpadding='5'><caption>Bài tập tạo bảng bằng các phép toán do người dùng nhập vào các con số</caption>"); document.write("<tr><th width='150' height='40'></th> <th>+</th> <th>-</th> <th>*</th> <th>/</th></tr>"); document.write("<tr><td align='center'>a = "+a+"</td><td align='center' rowspan='2'>"+(a+b)+"</td> <td align='center' rowspan='2'>"+(a-b)+"</td> <td align='center' rowspan='2'>"+(a*b)+"</td> <td align='center' rowspan='2'>"+ ab+" </td> </tr>"); document.write("<tr><td align='center'>b = "+b+"</td></tr>"); document.write("</table>"); // END Bài tập tạo bảng bằng các phép toán do người dùng nhập vào các con số </script> <!-- End code javascript --> </body> </html>
Một số code bài tập trong bài : Code 1 : Demo bài 1: Xem demo bài 1 về javascript tại đây. HTML: <!doctype html> <html> <head> <meta charset="utf-8"> <title>Bai 8: Học javascript căn bản lệnh điều kiện bài 1</title> <meta name="description" content="Bai 8: Học javascript căn bản lệnh điều kiện bài 1, Học javascript căn bản lệnh điều kiện bài 1" > </head> <body> <h1 align="center">Bai 8: Học javascript căn bản lệnh điều kiện bài 1</h1> <script type="text/javascript"> a=6; b=10; c=12; //lệnh rẽ nhánh IF /* Dạng 1 : Cấu trúc if(dieu_kien) { thuc_hien_khi_lenh_dung; } */ //VD Dạng 1 if(a>b) { document.write('Hello Javascript<br><br>'); } /* Dạng 2 : Cấu trúc if(dieu_kien) { thuc_hien_khi_DK_dung; } else { thuc_hien_khi_DK_Sai; } */ //VD Dạng 2 if(a<b) { document.write("Hello abc<br><br>"); } else { document.write("Hello xyz<br><br>"); } //Bài tập 1 : tìm số lớn nhất trong 3 số vừa nhập /* a=parseInt(prompt("Nhập giá trị a",'')); b=parseInt(prompt("Nhập giá trị b",'')); c=parseInt(prompt("Nhập giá trị c",'')); document.write("Giá trị a: "+a+"<br>Giá trị b: "+b+"<br>Giá trị c: "+c + "<br><br>") */ //cách 1 /* if(a>b && a>c) { document.write("Giá trị a ="+a+" là số lớn nhất") } if(b>a && b>c) { document.write("Giá trị b ="+b+" là số lớn nhất") } if(c>a && c>b) { document.write("Giá trị c ="+c+" là số lớn nhất") } */ //cách 2 /* if(a>b) { if(a>c) { alert("Số lớn nhất " + a) } else { alert("Số lớn nhất "+ c); } } else { if(b>c) { alert("Số lớn nhất " + b) } else { alert("Số lớn nhất "+ c); } } */ //Cách 3 /* Max=a; if(Max<b) { Max=b; } if(Max<c) { Max=c } alert("Số lớn nhất "+ Max); */ /*Bài tập 2 : Nhập vào 2 số nguyên bất kỳ. Nhập vào 1 phép toán(+, -, *, /) In ra trang web kết quả của 2 số với phép toán vừa nhập */ a=parseInt(prompt("Nhập số thứ 1",'')); b=parseInt(prompt("Nhập số thứ 2",'')); pheptoan=prompt("Nhập phép toán +, - , * , /",''); var ketqua; //cách 1 if(pheptoan=="+") { ketqua=a+b; document.write("Kết quả của "+a+"+"+b+"="+ketqua); } else if(pheptoan=="-") { ketqua=a-b; document.write("Kết quả của "+a+"-"+b+"="+ketqua); } else if(pheptoan=="*") { ketqua=a*b; document.write("Kết quả của "+a+"*"+b+"="+ketqua); } else if(pheptoan=="/") { if(b!=0) { ketqua=a/b; document.write("Kết quả của "+a+"/"+b+"="+ketqua); } else { document.write("Phép toán / giá trị số thứ 1 không được bằng 0"); } } else { document.write("Bạn đã nhập sai phép toán, vui lòng nhập lại") } //cách 2 if(c=="+") { ketqua=a+b; } else if(c=="-") { ketqua=a-b; } else if(c=="*") { ketqua=a*b; } else if(c=="/") { if(b!=0) { ketqua=a/b; } else { document.write("Phép toán / giá trị số thứ 1 không được bằng 0"); } } document.write("Kết quả của "+a+"+pheptoan+"+b+"="+ketqua); </script> </body> </html>
