KHOA CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG
BỘ MÔN MẠNG MÁY TÍNH VÀ TRUYỀN THÔNG
LẬP TRÌNH WEB
ThS. NGUYỄN CAO HỒNG NGỌC
Chương 6: Javascript
Nội dung
Giới thiệu Javascript
Biến, phạm vi biến, kiểu dữ liệu, hàm
Popup boxes
HTML event handlers
Ths. Nguyễn Cao Hồng Ngọc 2
HTML event handlers
Javascript nâng cao
Giới thiệu Javascript
Ths. Nguyễn Cao Hồng Ngọc 3
Giới thiệu Javascript (tt)
Javascript
• Là ngôn ngữ script, hướng đối tượng, được thông dịch
và thực thi bởi trình duyệt tại client
•
Khác với Java
•
•
•
Được hỗ trợ bởi tất cả các trình duyệt phổ biến: IE,
Firefox, Chrome, Opera, Safari,…
Ths. Nguyễn Cao Hồng Ngọc 4
Kiểm tra form input
Phản ứng khi có sự kiện
<form name=“myForm” action=“server.php” method=“post”
onsubmit=“return validateForm()” >
Your name: <input type=“text” name =“yourname”>
<input type=“submit” value=“Submit”>
Phản ứng khi có sự kiện
Ths. Nguyễn Cao Hồng Ngọc 7
<input type=“submit” value=“Submit”>
</form>
function validateForm() {
var x=document.forms[“myForm”][“yourname”].value;
if (x==null || x==“”) {
alert(“Your name must be filled out”);
return false;
}
}
Giới thiệu Javascript (tt)
Vị trí nhúng Javascript
• Trong trang HTML:
Mã lệnh Javascript được đặt trong thẻ script, có thể nằm
trong thẻ <head> hay thẻ <body>
Ths. Nguyễn Cao Hồng Ngọc 8
<html>
<body>
<h1>My First Web Page</h1>
trong
Javascript
theo
định
dạng
sau
:
•
Các
định
danh
trong
Javascript
theo
định
dạng
sau
:
Kí tự đầu tiên phải là một chữ cái, “_” hay “$”
Theo sau có thể là chữ cái, “_”, “$” hay số
• Khối lệnh nằm trong cặp dấu ngoặc nhọn {}
• Có 2 cách chú thích
Chú thích trên một dòng // this is a single line comment
Chú thích trên nhiều dòng /* this is a
multi-line comment */
Ths. Nguyễn Cao Hồng Ngọc 10
Biến
Biến dùng để chứa dữ liệu
Khai báo biến:
Kiểu dữ liệu
Số nguyên
Số thực và số có dấu chấm động
Luận lý: true, false
Chuỗi: “Viet Nam”, “I love you”, “
\
n”, “
\
t”,…
Chuỗi: “Viet Nam”, “I love you”, “
\
n”, “
\
t”,…
Dùng toán tử typeof để xác định kiểu dữ liệu của một
biến, các giá trị có thể là “undefined”, “boolean”,
“string”, “object”, “function”
Ths. Nguyễn Cao Hồng Ngọc 13
var quote = “I read \”The Vinci Code\” by Dan Brown.”
document.write(quote);
var quote = “I read \”The Vinci Code\” by Dan Brown.”
document.write(typeof quote);
// display “string”
Kiểu dữ liệu (tt)
Đối tượng
• String
http://www.w3schools.com/jsref/jsref_obj_string.asp
• Date
“Johnny”
myString.toLowerCase() “go johnny, go go go”
myString.replace(/Go/, “Up”) “Up Johnny, Go Go Go”
Array
Ths. Nguyễn Cao Hồng Ngọc 17
<script type=“text/javascript”>
var fruits = [“banana”, “orange”, “apple”, “mango”]
document.write(fruits.sort());
</scrip>
Array: ví dụ
Ths. Nguyễn Cao Hồng Ngọc 18
</scrip>
<script type=“text/javascript”>
function sortNumber(a, b) {
return a – b;
}
var n = [“10”, “5”, “40”, “25”, “100”, “1”]
document.write(n.sort(sortNumber));
</script>
Date
Ths. Nguyễn Cao Hồng Ngọc 19
Date (tt)
Ths. Nguyễn Cao Hồng Ngọc 20
RegExp
Ths. Nguyễn Cao Hồng Ngọc 21
RegExp (tt)
Ths. Nguyễn Cao Hồng Ngọc 22
RegExp (tt)
Ths. Nguyễn Cao Hồng Ngọc 23
// match all instances of “at” in a string
select lists
textareas
buttons
Copyright: Tài liệu đại học ©