Download miễn phí Bài giảng Lập trình web - Javascript cơ bản
JavaScript - Một số đối tượng xây dựng sẵn
String object
Number object Number object
Date object
Math object
Array object
Popup windows
Mộtsốhàm toàn cục (global functions)
Một số hàm toàn cục (global functions)
thường sửdụng
Để tải bản Đầy Đủ của tài liệu, xin Trả lời bài viết này, Mods sẽ gửi Link download cho bạn sớm nhất qua hòm tin nhắn.
Ai cần download tài liệu gì mà không tìm thấy ở đây, thì đăng yêu cầu down tại đây nhé:
Nhận download tài liệu miễn phí
Tóm tắt nội dung tài liệu:
2/16/20111
ĐẠI HỌC SÀI GÒN – KHOA CNTT
LẬP TRÌNH WEB
B
P
T
R
Ì
N
H
W
E
JavaScript cơ bản
T
K
Ế
V
À
L
Ậ
P
GV: Trần Đình Nghĩa
[email protected]
T
H
I
Ế
T
1
2/16/2011
2
Nội dung thiết kế web
HTML
Form
CSS
B
Hosting
P
T
R
Ì
N
H
W
E
Publish website
T
K
Ế
V
À
L
Ậ
P
T
H
I
Ế
T
2
2/16/2011
3
Nội dung
DHTML
Ngôn ngữ client-script
B
P
T
R
Ì
N
H
W
E
JavaScript cơ bản
T
K
Ế
V
À
L
Ậ
P
Thực hành JavaScript
T
H
I
Ế
T
3
2/16/2011
4
Đánh giá
1. Điểm chuyên cần 0.1
2. Điểm thực hành 0.4
3 Điểm thi cuối kỳ 0 5
B
. .
Điểm HP = [1]*0.1 + [2]*0.4 + [3]*0.5
P
T
R
Ì
N
H
W
E
• Bài thực hành: Đồ án làm theo nhóm
T
K
Ế
V
À
L
Ậ
P
• Bài thi cuối kỳ: Bài thi viết
T
H
I
Ế
T
4
2/16/2011
5
Đồ án website
Sinh viên tự chọn nhóm làm việc: 1 nhóm 3-
4sv.
Mỗi nhóm sẽ chọn 1 đăng ký đề tài cụ thể cho
B
đồ án.
Các đề tài sẽ có một danh sách yêu cầu cụ thể.
P
T
R
Ì
N
H
W
E
Giảng viên sẽ đưa ra các tiêu chí chấm đề tài.
Thời i à á h thứ ộ h hấ đề tài
T
K
Ế
V
À
L
Ậ
P g an v c c c n p ay c m
giảng viên sẽ thông báo cụ thể.
T
H
I
Ế
T
5
2/16/2011
6
Đồ án website
Đánh giá đồ án môn học và tính điểm cho mỗi thành viên
trong nhóm sẽ theo qui tắc sau:
Điểm đồ án không phải là điểm của mỗi thành viên nhóm
Điểm cá nhân căn cứ trên % công việc làm trong nhóm
Vd: Điểm đồ án của nhóm 1: là 8 điểm
B
Nhóm 1 có 3 thành viên ( A, B, C)
Nếu mỗi thành viên đều đóng góp công sức bằng nhau
P
T
R
Ì
N
H
W
E
(33.33%) thì điểm mỗi thành viên là 8.
Ngược lại: (tính theo qui tắc sau)
• A làm 40% Điểm của A = (40%*8)/33 33% = 9 6
T
K
Ế
V
À
L
Ậ
P . .
• 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
T
H
I
Ế
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à
Lisa Lopuck, Web Design For Dummies (2nd
Edition) Wiley Publishing 2006
B
, ,
Craig Grannell, The Essential Guide to CSS and
P
T
R
Ì
N
H
W
E
HTML Web Design, Friends of ED, 2007
Dave Thau, The book of JavaScript (2nd
T
K
Ế
V
À
L
Ậ
P
edition), No Starch Press, 2007
T
H
I
Ế
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
.
Groups:
P
T
R
Ì
N
H
W
E
T
K
Ế
V
À
L
Ậ
P
T
H
I
Ế
T
8
2/16/2011
9
Script language & DHTML
B
P
T
R
Ì
N
H
W
E
T
K
Ế
V
À
L
Ậ
P
T
H
I
Ế
T
9
2/16/2011
10
Script language
Script : Ngôn ngữ lập trình thông dịch giúp
website tương tác với người dùng
Client-side-script (JavaScript, VBScript, …)
Được tải về máy client và thực thi bằng
B
web browser
Thiên về xử lý giao diện
P
T
R
Ì
N
H
W
E Server-side-script (Php, jsp, asp, aspx,…)
Được thực thi ở web server và trả kết quả
T
K
Ế
V
À
L
Ậ
P
về client
Thiên về xử lý truy cập hệ thống file trên
T
H
I
Ế
T
10
server, kết nối với CSDL trên server.
2/16/2011
11
Script language
Khi Browser gởi yêu cầu truy cập 1 trang web
trên web server có chứa script server-side và
client-side (HTML, client-side script, css, …)
B
Khi nhận được 1 yêu cầu, web server
(runtime-engine) sẽ thực hiện các lệnh server
à ở ế á
P
T
R
Ì
N
H
W
E script v g i đ n browser c c trang web
DHTML (chứa HTML, javascript, …)
T
K
Ế
V
À
L
Ậ
P
T
H
I
Ế
T
11
2/16/2011
12
DHTML
DHTML = Dynamic HyperText Markup
Language
DHTML = HTML + CSS + ClientScript +
HTML DOM
B
Tích hợp các chức năng của các trình duyệt
P
T
R
Ì
N
H
W
E thế hệ thứ 4
(IEv6, Firefox 2.0, Opera 7.0, Netscape 4, …)
T
K
Ế
V
À
L
Ậ
P
T
H
I
Ế
T
12
2/16/2011
13
JavaScript
Là ngôn ngữ dạng thông dịch
Ngôn ngữ script phổ biến trên Internet
Giúp trang web có tính tương tác
Khả năng của javascript:
B
Cho phép đặt dữ liệu động vào trang HTML
Tương tác với các sự kiện của HTML
P
T
R
Ì
N
H
W
E Thay đổi nội dung của các đối tượng HTML
Kết hợp với HTML DOM để tương tác với người
T
K
Ế
V
À
L
Ậ
P
dùng (menu động, các nút đồ hoạ, …)
Kiểm tra dữ liệu nhập từ phía client (Form
T
H
I
Ế
T
13
Validation)
2/16/2011
14
Nhúng Javascript vào trang web
some statements
some statements
scr p
B
P
T
R
Ì
N
H
W
E
some statements
ê /
T
K
Ế
V
À
L
Ậ
P
T
H
I
Ế
T
14
2/16/2011
15
Nhúng Javascript vào trang web
Đặt giữa tag và :
Đoạn script sẽ thực thi ngay khi trang web
được mở.
B
Đặt giữa tag và :
Đoạn script được thực thi khi trang web
P
T
R
Ì
N
H
W
E
đang mở (sau khi thực thi các đoạn script
trong phần
T
K
Ế
V
À
L
Ậ
P
Số lượng đoạn script không hạn chế.
T
H
I
Ế
T
15
2/16/2011
16
JavaScript
Giới thiệu JavaScript
Chức năng
B
Cú pháp và quy ước
P
T
R
Ì
N
H
W
E
Cấu trúc lập trình cơ bản
T
K
Ế
V
À
L
Ậ
P
C
T
H
I
Ế
T
16
á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 JavaScript có thể đặt trong file
B
riêng (*.js) và nhúng (embed, include) vào file
HTML bằng thuộc tính scr của thẻ script
P
T
R
Ì
N
H
W
E
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
(function) chỉ được thực hiện khi có lời gọi
hàm
T
H
I
Ế
T
17
2/16/2011
18
Giới thiệu JavaScript
document.write(“Hello world!”);
d i (“ ll ld!”)
B
ocument.wr te He o wor ;
P
T
R
Ì
N
H
W
E
T
K
Ế
V
À
L
Ậ
P
T
H
I
Ế
T
18
2/16/2011
19
Giới thiệu JavaScript
JavaScriptIntro.html
B
P
T
R
Ì
N
H
W
E
T
K
Ế
V
À
L
Ậ
P
T
H
I
Ế
T
19
//JavaScript document
alert(“JavaScript in external js
file!”); external.js
2/16/2011
20
JavaScript – Cú pháp & quy ước
Quy ước của ngôn ngữ lập trình
Biến và kiểu dữ liệu
Toán tử và phép so sánh
ấ ề ể
B
C u trúc đi u khi n
Hàm
P
T
R
Ì
N
H
W
E
Một số đối tượng xây dựng sẵn (build-
in)
T
K
Ế
V
À
L
Ậ
P
Các hàm mở cửa sổ thông báo
(pop-up windows)
T
H
I
Ế
T
20
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 phải kết thúc bằng dấu ;
B
Không phân biệt khoảng trắng, tab, xuống
dòng trong câu lệnh.
P
T
R
Ì
N
H
W
E
// Ghi chú 1 dòng /* ..*/ Ghi chú 1 khối
{ } Khối lệnh [ ] Sử dụng cho mảng
T
K
Ế
V
À
L
Ậ
P
( ) Sử dụng cho hàm \n, \t Xuống hàng, ký tự Tab
\’ Ký tự nháy đơn trong chuỗi \” Ký tự nháy kép trong chuỗi
T
H
I
Ế
T
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
T
R
Ì
N
H
W
E
T
K
Ế
V
À
L
Ậ
P
T
H
I
Ế
T
22
2/16/2011
23
JavaScript – Biến và kiểu dữ liệu
Cách đặt tên biến
ắ ầ ằ ấB t đ u b ng một chữ cái hay d u _
A..Z,a..z,0..9, : phân biệt HOA, Thường
B
_
Khai báo biến
P
T
R
Ì
N
H
W
E Dùng từ khóa var
Ví dụ: var count=10 amount;
T
K
Ế
V
À
L
Ậ
P ,
Thật sự tồn tại khi bắt đầu sử dụng lần
T
H
I
Ế
T
23
đầu tiên
2/16/2011
24
JavaScript – Biến và kiểu dữ liệu
Kiểu dữ liệu
Number : số nguyên, thực
Boolean - True or False
String - “Hello ...