2/16/2011
1
ĐẠI HỌC SÀI GÒN – KHOA CNTT
LẬP TRÌNH WEB
B
LẬP
TRÌNH
WEB
P
TRÌNH WE
JavaScript cơ bản
T
KẾ VÀ LẬ
P
GV: Trần Đình Nghĩa
THIẾ
T
1
2/16/2011
2
Nội dung thiết kế web
HTML
F
orm
CSS
P
TRÌNH WE
JavaScript cơ bản
T
KẾ VÀ LẬ
P
Thực hành JavaScript
THIẾ
T
3
Thực
hành
JavaScript
2/16/2011
4
Đánh giá
1. Điểm chuyên cần0.1
2. Điểm thực hành 0.4
3
Điểm thi cuối kỳ
05
B
3
.
Điểm thi cuối kỳ
0
KẾ VÀ LẬ
P
Thời
g
i
an
v
à
c
á
c
h thứ
c
n
ộ
p
h
ay
c
hấ
m
đề tài
giảng viên sẽ thông báo cụ thể.
THIẾ
T
5
Điểm của A = (40%*8)/33
.
33% = 9
.
6
• B làm 30% Điểm của B = (30%*8)/33.33% = 7.2
•C làm 30% Điểm của C = (30%*8)/33.33% = 7.2
THIẾ
T
6
Tất cả các điểm trên 10 sẽ được làm tròn thành 10
2/16/2011
7
Tài liệu tham khảo
và
htt
p
:
//
www.w3.or
g/
p// g/
Lisa Lopuck, Web Design For Dummies (2nd
Edition)
Wiley
Publishing
2006
B
Edition)
KẾ VÀ LẬ
P
ae
au,
e
boo
o
Ja aSc pt
(
d
edition), No Starch Press, 2007
THIẾ
T
7
Google, google, google …
2/16/2011
8
Liên hệ
Giảng viên: Trần Đình Nghĩa
Phòng KT & KĐCLGD – ĐHSG
Email:
tdnghia1977@gmail com
B
Email:
tdnghia1977@gmail
.
com
Groups:
c tải về má
y
client và th
ự
c thi bằn
g
B
ợ y ự g
web browser
Thiên về xử lý giao diện
P
TRÌNH WE
Server-side-script (Php, jsp, asp, aspx,…)
Đ
ư
ợ
c th
ự
c thi ở web server và trả kết
q
uả
T
KẾ VÀ LẬ
P
ợ ự q
về client
Thiên về xử lý truy cập hệ thống file trên
THIẾ
11
2/16/2011
12
DHTML
DHTML = Dynamic HyperText Markup
Language
DHTML = HTML + CSS + ClientScript +
HTML DOM
B
Tích hợp các tính năng của các trình duyệt
P
TRÌNH WE
thế hệ thứ 4
(IEv6, Firefox 2.0, Opera 7.0, Netscape 4, …)
T
KẾ VÀ LẬ
P
THIẾ
T
12
2/16/2011
13
JavaScript
Là ngôn ngữ dạng thông dịch
N
gô
n n
gữ
sc
Cho phép đặt dữ liệu động vào trang HTML
Tươn
g
tác với các sự kiện của HTML
P
TRÌNH WE
g
Thay đổi nội dung của các đối tượng HTML
Kết h
ợp
với HTML DOM để tươn
g
tác với n
g
ười
T
KẾ VÀ LẬ
P
ợp g g
dùng (menu động, các nút đồ hoạ, …)
Kiểmtradữ liệunhậptừ phía client (Form
THIẾ
T
13
Kiểm
tra
p
t>
B
</script>
</head>
<body>
P
TRÌNH WE
<script type="text/javascript">
some statements
</script>
ê
/
T
KẾ VÀ LẬ
P
<script
s
rc=“T
ê
n_file_script.js"> <
/
script
>
</body>
</html>
THIẾ
T
14
n
sc
ri
pt
được
t
h
ực
t
hi khi
t
r
a
n
g
w
eb
P
TRÌNH WE
oạ sc pt đượct ựct ta g eb
đang mở (sau khi thực thi các đoạn script
trong phần <head>
T
KẾ VÀ LẬ
P
C
THIẾ
T
16
C
ác ví dụ
2/16/2011
17
Giới thiệu JavaScript
Web browser thực thi thẻ script khi load trang
web HTML theo thứ tự từ trên xuống dưới
Source code JavaScri
p
t có thể đ
ặ
t tron
g
file
B
p ặ g
riêng (*.js) và nhúng (embed, include) vào file
HTML bằng thuộc tính scr của thẻ script
P
TRÌNH WE
Code JavaScript được browser xử lý cùng
T
KẾ VÀ LẬ
P
thứ tự với các thẻ HTML. Trừ các hàm
</html>
T
KẾ VÀ LẬ
P
THIẾ
T
18
2/16/2011
19
Giới thiệu JavaScript
JavaScri
p
tIntro.html
p
B
P
TRÌNH WE
T
KẾ VÀ LẬ
P
THIẾ
T
19
//JavaScript document
alert(“JavaScript in external js
file!”);
external.js
2/16/2011
20
KẾ VÀ LẬ
P
in)
Các hàm mở cửa sổ thông báo
(pop
-
up windows)
THIẾ
T
20
(pop
-
up
windows)
2/16/2011
21
JavaScript – Cú pháp & quy ước
JavaScript có cú pháp, ký hiệu tương tự
như Java và C
++
Phân biệt hoa thường
M
ọ
i l
ệ
nh
p
hải kết thúc bằn
g
21
Chuỗi phân biệt khi dùng dấu nháy đơn ‘
và dấu nháy kép “
2/16/2011
22
JavaScript – Phân biệt chuỗi với ‘ và ‘’
B
P
TRÌNH WE
T
KẾ VÀ LẬ
P
THIẾ
T
22
2/16/2011
23
JavaScript – Biến và kiểu dữ liệu
Cách đặt tên biến
ắ
ầ
ằ
ấ
B
ắ
t đ
ầ
ub
Khai báo biến
P
TRÌNH WE
Dùng từ khóa var
Ví
dụ
:
var
count
=
10
amount
;
T
KẾ VÀ LẬ
P
Ví
dụ
:
var
count
10
,
amount
;
Thậtsự tồntạikhibắt đầusử dụng lần
THIẾ
T
ệ
u bất k
ỳ
và có thể
THIẾ
T
24
ệ ỳ
thay đổi kiểu dữ liệu trong quá trình hoạt động
2/16/2011
25
JavaScript – Biến và kiểu dữ liệu
Biến tự đổi kiểu dữ liệu khi giá trị thay đổi
Ví dụ:
var x = 10;
x = “hello world !”;
B
Có thể cộng 2 biến khác kiểu dữ liệu
Ví d
ụ
:
P
TRÌNH WE
ụ
var x;
x = “12” + 34.5; // KQ: x = “1234.5”
T
KẾ VÀ LẬ