Đây là quyển sách giới thiệu cơ bản về javascipt cho người mới bắt đầu và tài liệu tham khảo để phát triển ứng dụng của bạn.
CHƯƠNG 1 LỜI NÓI ĐẦU 4
CHƯƠNG 2 NHẬP MÔN JAVASCRIPT 5
2.1.Nhúng JavaScript vào file HTML 5
2.3. Thẻ <NOScript> và </NOSCRIPT> 6
2.3. Hiển thị một dòng text 7
2.4. Giao tiếp với người sử dụng 9
2.5. Điểm lại các lệnh và mở rộng 12
CHƯƠNG 3 BIẾN TRONG JAVASCRIPT 13
3.1. Biến và phân loạI biến 13
3.2. Biểu diễn từ tố trong JavaScript 13
3.3. Kiểu dữ liệu 13
1.1.1. KIểu nguyên (Interger) 14
1.1.2. Kiểu dấu phẩy động (Floating Point) 14
1.1.3. Kiểu logic (Boolean) 15
1.1.4. Kiểu chuỗi (String) 15
2. XÂY DỰNG CÁC BIỂU THỨC TRONG JAVASCRIPT 16
ĐỊNH NGHĨA VÀ PHÂN LOẠI BIỂU THỨC 16
CÁC TOÁN TỬ (OPERATOR) 16
2.1.1. Gán 16
2.1.2. So sánh 16
2.1.3. Số học 17
2.1.4. Chuỗi 17
2.1.5. Logic 17
2.1.6. Bitwise 18
BÀI TẬP 19
2.1.7. Câu hỏi 19
2.1.8. Trả lời 19
3. CÁC LỆNH 20
CÂU LỆNH ĐIỀU KIỆN 20
CÂU LỆNH LẶP 21
3.1.1. Vòng lặp for 21
3.1.2. while 22
3.1.3. Break 22
3.1.4. continue 22
CÁC CÂU LỆNH THAO TÁC TRÊN ĐỐI TƯỢNG 23
3.1.5. for .in 23
3.1.6. new 24
3.1.7. this 26
3.1.8. with 26
CÁC HÀM (FUNCTIONS) 27
CÁC HÀM CÓ SẴN 29
3.1.9. eval 29
3.1.10. parseInt 30
3.1.11. parseFloat 31
MẢNG (ARRAY) 32
SỰ KIỆN 34
BÀI TẬP 37
3.1.12. Câu hỏi 37
3.1.13. Trả lời 39
4. CÁC ĐỐI TƯỢNG TRONG JAVASCRIPT 42
ĐỐI TƯỢNG NAVIGATOR 44
ĐỐI TƯỢNG WINDOW 45
4.1.1. Các thuộc tính 45
4.1.2. Các phương thức 46
4.1.3. Các chương trình xử lý sự kiện 47
ĐỐI TƯỢNG LOCATION 47
ĐỐI TƯỢNG FRAME 48
4.1.4. Các thuộc tính 48
4.1.5. Các phương thức 48
4.1.6. Sử dụng Frame 48
ĐỐI TƯỢNG DOCUMENT 50
4.1.7. Các thuộc tính 51
4.1.8. Các phương thức 51
ĐỐI TƯỢNG ANCHORS 51
ĐỐI TƯỢNG FORMS 52
4.1.9. Các thuộc tính 52
4.1.10. Các phương thức 52
4.1.11. Các chương trình xử lý sự kiện 52
ĐỐI TƯỢNG HISTORY 53
4.1.12. Các thuộc tính 53
4.1.13. Các phương thức 53
ĐỐI TƯỢNG LINKS 53
4.1.14. Các thuộc tính 53
4.1.15. Các chương trình xử lý sự kiện 54
ĐỐI TƯỢNG MATH 54
4.1.16. Các thuộc tính 54
4.1.17. Các phương thức 54
ĐỐI TƯỢNG DATE 55
4.1.18. Các phương thức 55
ĐỐI TƯỢNG STRING 56
4.1.19. Các phương thức 56
CÁC PHẦN TỬ CỦA ĐỐI TƯỢNG FORM 57
4.1.20. Thuộc tính type 58
4.1.21. Phần tử button 58
4.1.22. Phần tử checkbox 59
4.1.23. Phần tử File Upload 61
4.1.24. Phần tử hidden 61
4.1.25. Phần tử Password 61
4.1.26. Phần tử radio 62
4.1.27. Phần tử reset 64
4.1.28. Phần tử select 64
5. MÔ HÌNH ĐỐI TƯỢNG (OBJECT MODEL) 74
ĐỐI TƯỢNG VÀ THUỘC TÍNH 74
TẠO CÁC ĐỐI TƯỢNG MỚI 75
5.1.1. Sử dụng khởi tạo đối tượng 75
5.1.2. Sử dụng một hàm xây dựng(Constructor Function) 76
5.1.3. Lập mục lục cho các thuộc tính của đối tượng 77
5.1.4. Định nghĩa thêm các thuộc tính cho một kiểu đối tượng 78
5.1.5. Định nghĩa các cách thức 78
5.1.6. Sử dụng cho các tham chiếu đối tượng (Object References) 79
5.1.7. Xoá đối tượng 79
6. BẢNG TỔNG KẾT CÁC TỪ KHOÁ 80
7. TỔNG KẾT 81
96 trang |
Chia sẻ: tlsuongmuoi | Lượt xem: 2075 | Lượt tải: 1
Bạn đang xem trước 20 trang tài liệu Giáo Trình JavaScipt, để xem tài liệu hoàn chỉnh bạn click vào nút DOWNLOAD ở trên
rence.close -§ãng cöa sæ windowReference.
confirm("message") -HiÓn thÞ hép héi tho¹i víi chuçi "message", nót OK vµ nót Cancel. Tr¶ l¹i gi¸ trÞ True cho OK vµ False cho Cancel.
[windowVar = ][window]. open("URL", "windowName", [ "windowFeatures" ] ) - Më cöa sæ míi.
prompt ("message" [,"defaultInput"]) - Më mét hép héi tho¹i ®Ó nhËn d÷ liÖu vµo trêng text.
TimeoutID = setTimeout(expression,msec) - §¸nh gi¸ biÓu thøc expresion sau thêi gian msec.
VÝ dô: Sö dông tªn cöa sæ khi gäi tíi nã nh lµ ®Ých cña mét form submit hoÆc trong mét Hipertext link (thuéc tÝnh TARGET cña thÎ FORM vµ A).
Trong vÝ dô t¹o ra mét tíi cöa sæ thø hai, nh nót thø nhÊt ®Ó më mét cöa sæ rçng, sau ®ã mét liªn kÕt sÏ t¶i file doc2.html xuèng cöa sæ míi ®ã råi mét nót kh¸c dïng ®Ó ®ãng cña sæ thø hai l¹i, vÝ dô nµy la vµo file window.html:
Frame Example
Load a file into window2
<INPUT TYPE="button" VALUE="Close Second Window"
onClick="msgWindow.close()">
H×nh 6.3: Minh ho¹ cho ®èi tîng cöa sæ
C¸c ch¬ng tr×nh xö lý sù kiÖn
onLoad - XuÊt hiÖn khi cöa sæ kÕt thóc viÖc t¶i.
onUnLoad - XuÊt hiÖn khi cöa sæ ®îc lo¹i bá.
§èi tîng location
C¸c thuéc tÝnh cña ®èi tîng location duy tr× c¸c th«ng tin vÒ URL cña document hiÖn thêi. §èi tîng nµy hoµn toµn kh«ng cã c¸c ph¬ng thøc vµ ch¬ng tr×nh xö lý sù kiÖn ®i kÌm. VÝ dô:
http:// www.abc.com/ chap1/page2.html#topic3
C¸c thuéc tÝnh
hash - Tªn anchor cña vÞ trÝ hiÖn thêi (vÝ dô topic3).
Host - PhÇn hostname:port cña URL (vÝ dô www.abc.com ). Chó ý r»ng ®©y thêng lµ cæng ngÇm ®Þnh vµ Ýt khi ®îc chØ ra.
Hostname - Tªn cña host vµ domain (vÝ dô www.abc.com ).
href - Toµn bé URL cho document hiÖn t¹i.
Pathname - PhÇn ®êng dÉn cña URL (vÝ dô /chap1/page2.html).
Port - Cæng truyÒn th«ng ®îc sö dông cho m¸y tÝnh host, thêng lµ cæng ngÇm ®Þnh.
Protocol - Giao thøc ®îc sö dông (cïng víi dÊu hai chÊm) (vÝ dô http:).
Search - C©u truy vÊn t×m kiÕm cã thÓ ë cuèi URL cho c¸c script CGI.
§èi tîng frame
Mét cöa sè cã thÓ cã mét vµi frame. C¸c frame cã thÓ cuén mét c¸ch ®éc lËp víi nhau vµ mçi frame cã URL riªng. frame kh«ng cã c¸c ch¬ng tr×nh xö lý sù kiÖn. Sù kiÖn onLoad vµ onUnLoad lµ cña ®èi tîng window.
C¸c thuéc tÝnh
frames - M¶ng tÊt c¶ c¸c frame trong cöa sæ.
Name - Thuéc tÝnh NAME cña thÎ
Length - Sè lîng c¸c frame con trong mét frame.
Parent - Cöa sæ hay frame chøa nhãm frame hiÖn thêi.
self - frame hiÖn thêi.
Window - frame hiÖn thêi.
C¸c ph¬ng thøc
clearTimeout (timeoutID) - Xo¸ timeout do setTimeout lËp. SetTimeout tr¶ l¹i timeoutID.
TimeoutID = setTimeout (expression,msec) - §¸nh gi¸ expression sau khi hÕt thêi gian msec.
Sö dông Frame
a) T¹o mét frame (create)
§Ó t¹o mét frame, ta sö dông thÎ FRAMESET. Môc ®Ých cña thÎ nµy lµ ®Þnh nghÜa mét tËp c¸c frame trong mét trang.
VÝ dô1: t¹o frame ( h×nh 17)
Frame Example
S¬ ®å sau hiÓn thÞ cÊu tróc cña c¸c frame: C¶ 3 frame ®Òu trªn cïng mét cöa sæ cha, mÆc dï 2 trong sè c¸c frame ®ã n»m trong mét frameset kh¸c.
Top
listFrame (category.html)
contentFrame (titles.html)
navigatorFrame (navigator.html)
B¹n cã thÓ gäi tíi nh÷ng frame tríc ®ã b»ng c¸ch sö dông thuéc tÝnh frames nh sau:
listFrame chÝnh lµ top.frames[0]
contentFrame chÝnh lµ top.frames[1]
navigatorFrame chÝnh lµ top.frames[2]
H×nh 6.4: KÕt qu¶ viÖc t¹o frame trong
VÝ dô 2: Còng gièng nh mét sù lùa chän, b¹n cã thÓ t¹o ra mét cöa sæ gièng nh vÝ dô tríc nhng trong mçi ®Ønh cña hai frame l¹i cã mét cöa sæ cha riªng tõ navigateFrame. Møc frameset cao nhÊt cã thÓ ®îc ®Þnh nghÜa nh sau:
Frame Example
Trong file muske13.html l¹i tiÕp tôc ®Æt mét frameset:
Frame Example
Khi ®ã kÕt qu¶ hiÓn thÞ cña vÝ dô 2 gièng vÝ dô 1 nhng sù ph©n cÊp cña c¸c frames l¹i kh¸c h¼n:
top
upperFrame (muske13.html)
navigatorFrame (navigator.html)
listFrame (category.html)
contentFrame (titles.html)
B¹n cã thÓ gäi tíi c¸c frame trªn b»ng c¸ch sö dông thuéc tÝnh m¶ng frames nh sau:
upperFrame chÝnh lµ top.frames[0]
navigatorFrame chÝnh lµ top.frames[1]
listFrame chÝnh lµ upperFrame.frames[0]
hoÆc top.frames[0].frames[0]
contentFrame chÝnh lµ upperFrame.frames[1]
hoÆc top.frames[0].frames[1]
b) CËp nhËt mét frame (update)
B¹n cã thÓ cËp nhËt néi dung cña mét frame b»ng c¸ch sö dông thuéc tÝnh location ®Ó ®Æt ®Þa chØ URL vµ ph¶i ®Þnh chØ râ vÞ trÝ cña frame trong cÊu tróc.
Trong vÝ dô trªn, nÕu b¹n thªm mét dßng sau vµo navigatorFrame:
th× khi nót “Titles only” ®îc nhÊn, file artist.html sÏ ®îc t¶i vµo upperFrame, vµ hai frame listFrame, contentFrame sÏ bÞ ®ãng l¹i nh chóng cha bao giê tån t¹i.
§èi tîng document
§èi tîng nµy chøa c¸c th«ng tin vÒ document hiÖn thêi vµ cung cÊp c¸c ph¬ng thøc ®Ó ®a th«ng tin ra mµn h×nh. §èi tîng document ®îc t¹o ra b»ng cÆp thÎ vµ . Mét sè c¸c thuéc tÝnh g¾n víi thÎ .
C¸c ®èi tîng anchor, forms, history, links lµ thuéc tÝnh cña ®èi tîng document. Kh«ng cã c¸c ch¬ng tr×nh xö lý sù kiÖn cho c¸c frame. Sù kiÖn onLoad vµ onUnLoad lµ cho ®èi tîng window.
C¸c thuéc tÝnh
alinkColor - Gièng nh thuéc tÝnh ALINK.
anchor - M¶ng tÊt c¶ c¸c anchor trong document.
bgColor - Gièng thuéc tÝnh BGCOLOR.
cookie - Sö dông ®Ó x¸c ®Þnh cookie.
fgColor - Gièng thuéc tÝnh TEXT.
forms - M¶ng tÊt c¶ c¸c form trong document.
lastModified - Ngµy cuèi cïng v¨n b¶n ®îc söa.
linkColor - Gièng thuéc tÝnh LINK.
links - M¶ng tÊt c¶ c¸c link trong document.
location - URL ®Çy ®ñ cña v¨n b¶n.
referrer - URL cña v¨n b¶n gäi nã.
title - Néi dung cña thÎ .
vlinkColor - Gièng thuéc tÝnh VLINK.
C¸c ph¬ng thøc
document.clear - Xo¸ document hiÖn thêi.
document.close - §ãng dßng d÷ liÖu vµo vµ ®a toµn bé d÷ liÖu trong bé ®Öm ra mµn h×nh.
document.open (["mineType"]) - Më mét stream ®Ó thu thËp d÷ liÖu vµo cña c¸c phwong thøc write vµ writeln.
document.write(expression1 [,expression2]...[,expressionN]) - ViÕt biÓu thøc HTML lªn v¨n b¶n tr«ng mét cöa sæ x¸c ®Þnh.
document.writeln (expression1 [,expression2] ... [,expressionN] ) - Gièng ph¬ng thøc trªn nhng khi hÕt mçi biÓu thøc l¹i xuèng dßng.
§èi tîng anchors
anchor lµ mét ®o¹n v¨n b¶n trong document cã thÓ dïng lµm ®Ých cho mét siªu liªn kÕt. Nã ®îc x¸c ®Þnh b»ng cÆp thÎ vµ . §èi tîng anchor kh«ng cã thuéc tÝnh, ph¬ng thøc còng nh ch¬ng tr×nh xö lý sù kiÖn. M¶ng anchor tham chiÕu ®Õn mçi anchor cã tªn trong document. Mçi anchor ®îc tham chiÕu b»ng c¸ch:
document.anchors [index]
M¶ng anchor cã mét thuéc tÝnh duy nhÊt lµ length x¸c ®Þnh sè lîng c¸c anchor trong document, nã cã thÓ ®îc x¸c ®Þnh nh sau:
document.anchors.length.
§èi tîng forms
C¸c form ®îc t¹o ra nhê cÆp thÎ vµ . PhÇn lín c¸c thuéc tÝnh cña ®èi tîng form ph¶n ¸nh c¸c thuéc tÝnh cña thÎ . Cã mét vµi phÇn tö (elements) lµ thuéc tÝnh cña ®èi tîng forms:
button
checkbox
hidden
password
radio
reset
select
submit
text
textarea
C¸c phÇn tö nµy sÏ ®îc tr×nh bµy sau.
NÕu document chøa mét vµi form, chóng cã thÓ ®îc tham chiÕu qua m¶ng forms. Sè lîng c¸c form cã thÓ ®îc x¸c ®Þnh nh sau:
document.forms.length.
Mçi mét form cã thÓ ®îc tham chiÕu nh sau:
document.forms[index]
C¸c thuéc tÝnh
action thuéc tÝnh ACTION cña thÎ FORM.
elements M¶ng chøa tÊt c¶ c¸c thµnh phÇn trong mét form (nh checkbox, trêng text, danh s¸ch lùa chän
encoding X©u chøa kiÓu MIME ®îc sö dông ®Ó m· ho¸ néi dung cña form göi cho server.
length Sè lîng c¸c thµnh phÇn trong mét form.
method Thuéc tÝnh METHOD.
target X©u chøa tªn cña cöa sæ ®Ých khi submit form
C¸c ph¬ng thøc
formName.submit () - XuÊt d÷ liÖu cña mét form tªn formName tíi trang xö lý. Ph¬ng thøc nµy m« pháng mét click vµo nót submit trªn form.
C¸c ch¬ng tr×nh xö lý sù kiÖn
onSubmit - Ch¬ng tr×nh xö lý sù kiÖn nµy ®îc gäi khi ngêi sö dông chuyÓn d÷ liÖu tõ form ®i.
§èi tîng history
§èi tîng nµy ®îc sö dông ®Ó lu gi÷ c¸c th«ng tin vÒ c¸c URL tríc ®îc ngêi sö dông sö dông. Danh s¸ch c¸c URL ®îc lu tr÷ theo thø tù thêi gian. §èi tîng nµy kh«ng cã ch¬ng tr×nh xö lý sù kiÖn.
C¸c thuéc tÝnh
length - Sè lîng c¸c URL trong ®èi tîng.
C¸c ph¬ng thøc
history.back() - §îc sö dông ®Ó tham chiÕu tíi URL míi ®îc th¨m tríc ®©y.
history.forward() - §îc sö dông ®Ó tham chiÕu tíi URL kÕ tiÕp trong danh s¸ch. Nã sÏ kh«ng g©y hiÖu øng g× nÕu ®· ®Õn cuèi cña danh s¸ch.
history.go (delta | "location") - §îc sö dông ®Ó chuyÓn lªn hay chuyÓn xuèng delta bËc hay di chuÓn ®Õn URL x¸c ®Þnh bëi location trong danh s¸ch. NÕu delta ®îc sö dông th× viÖc dÞch chuyÓn lªn phÝa trªn khi delta d¬ng vµ xuèng phÝa díi khi delta ©m. nÕu sö dông location, URL gÇn nhÊt cã chøa location lµ chuçi con sÏ ®îc tham chiÕu.
§èi tîng links
§èi tîng link lµ mét ®o¹n v¨n b¶n hay mét ¶nh ®îc xem lµ mét siªu liªn kÕt. C¸c thuéc tÝnh cña ®èi tîng link chñ yÕu xö lý vÒ URL cña c¸c siªu liªn kÕt. §èi tîng link còng kh«ng cã ph¬ng thøc nµo.
M¶ng link chøa danh s¸ch tÊt c¶ c¸c liªn kÕt trong document. Cã thÓ x¸c ®Þnh sè lîng c¸c link qua
document.links.length()
Cã thÓ tham chiÕu tíi mét liªn kÕt qña
document.links [index]
§Ó x¸c ®Þnh c¸c thuéc tÝnh cña ®èi tîng link, cã thÓ sö dông URL t¬ng tù:
C¸c thuéc tÝnh
hash - Tªn anchor cña vÞ trÝ hiÖn thêi (vÝ dô topic3).
Host - PhÇn hostname:port cña URL (vÝ dô www.abc.com). Chó ý r»ng ®©y thêng lµ cæng ngÇm ®Þnh vµ Ýt khi ®îc chØ ra.
Hostname - Tªn cña host vµ domain (vÝ dô ww.abc.com).
href - Toµn bé URL cho document hiÖn t¹i.
Pathname - PhÇn ®êng dÉn cña URL (vÝ dô /chap1/page2.html).
port - Cæng truyÒn th«ng ®îc sö dông cho m¸y tÝnh host, thêng lµ cæng ngÇm ®Þnh.
Protocol - Giao thøc ®îc sö dông (cïng víi dÊu hai chÊm) (vÝ dô http:).
Search - C©u truy vÊn t×m kiÕm cã thÓ ë cuèi URL cho c¸c script CGI.
Target - Gièng thuéc tÝnh TARGET cña .
C¸c ch¬ng tr×nh xö lý sù kiÖn
onClick - X¶y ra khi ngêi sö dông nhÊn vµo link.
onMouseOver - X¶y ra khi con chuét di chuyÓn qua link.
§èi tîng Math
§èi tîng Math lµ ®èi tîng néi t¹i trong JavaScript. C¸c thuéc tÝnh cña ®èi tîng nµy chøa nhiÒu h»ng sè to¸n häc, c¸c hµm to¸n häc, lîng gi¸c phæ biÕn. §èi tîng Math kh«ng cã ch¬ng tr×nh xö lý sù kiÖn.
ViÖc tham chiÕu tíi number trong c¸c ph¬ng thøc cã thÓ lµ sè hay c¸c biÓu thøc ®îc ®n¸h gi¸ lµ sè hîp lÖ.
C¸c thuéc tÝnh
E - H»ng sè Euler, kho¶ng 2,718.
LN2 - logarit tù nhiªn cña 2, kho¶ng 0,693.
LN10 - logarit tù nhiªn cña 10, kho¶ng 2,302.
LOG2E - logarit c¬ sè 2 cña e, kho¶ng 1,442.
PI - Gi¸ trÞ cña p, kho¶ng 3,14159.
SQRT1_2 - C¨n bËc 2 cña 0,5, kho¶ng 0,707.
SQRT2 - C¨n bËc 2 cña 2, kho¶ng 1,414.
C¸c ph¬ng thøc
Math.abs (number) - Tr¶ l¹i gi¸ trÞ tuyÖt ®èi cña number.
Math.acos (number) - Tr¶ l¹i gi¸ trÞ arc cosine (theo radian) cña number. Gi¸ trÞ cña number ph¶i n¨mg gi÷a -1 vµ 1.
Math.asin (number) - Tr¶ l¹i gi¸ trÞ arc sine (theo radian) cña number. Gi¸ trÞ cña number ph¶i n¨mg gi÷a -1 vµ 1.
Math.atan (number) - Tr¶ l¹i gi¸ trÞ arc tan (theo radian) cña number.
Math.ceil (number) - Tr¶ l¹i sè nguyªn nhá nhÊt lín h¬n hoÆc b»ng number.
Math.cos (number) - Tr¶ l¹i gi¸ trÞ cosine cña number.
Math.exp (number) - Tr¶ l¹i gi¸ trÞ e^ number, víi e lµ h»ng sè Euler.
Math.floor (number) - Tr¶ l¹i sè nguyªn lín nhÊt nhá h¬n hoÆc b»ng number.
Math.log (number) - Tr¶ l¹i logarit tù nhiªn cña number.
Math.max (num1,num2) - Tr¶ l¹i gi¸ trÞ lín nhÊt gi÷a num1 vµ num2
Math.min (num1,num2) - Tr¶ l¹i gi¸ trÞ nhá nhÊt gi÷a num1 vµ num2.
Math.pos (base,exponent) - Tr¶ l¹i gi¸ trÞ base luü thõa exponent.
Math.random (r) - Tr¶ l¹i mét sè ngÉu nhiªn gi÷a 0 vµ 1. Phwong thøc nµy chØ thùc hiÖn ®îc trªn nÒn t¶ng UNIX.
Math.round (number) - Tr¶ l¹i gi¸ trÞ cña number lµm trßn tíi sè nguyªn gÇn nhÊt.
Math.sin (number) - Tr¶ l¹i sin cña number.
Math.sqrt (number) - Tr¶ l¹i c¨n bËc 2 cña number.
Math.tan (number) - Tr¶ l¹i tag cña number.
§èi tîng Date
§èi tîng Date lµ ®èi tîng cã s½n trong JavaScript. Nã cung cÊp nhiÒu ph¬ng thøc cã Ých ®Ó xö lý vÒ thêi gian vµ ngµy th¸ng. §èi tîng Date kh«ng cã thuéc tÝnh vµ ch¬ng tr×nh xö lý sù kiÖn.
PhÇn lín c¸c ph¬ng thøc date ®Òu cã mét ®èi tîng Date ®i cïng. C¸c ph¬ng thøc giíi thiÖu trong phÇn nµy sö dông ®èi tîng Date dateVar, vÝ dô:
dateVar = new Date ('August 16, 1996 20:45:04');
C¸c ph¬ng thøc
dateVar.getDate() - Tr¶ l¹i ngµy trong th¸ng (1-31) cho dateVar.
dateVar.getDay() - Tr¶ l¹i ngµy trong tuÇn (0=chñ nhËt,...6=thø b¶y) cho dateVar.
dateVar.getHours() - Tr¶ l¹i giê (0-23) cho dateVar.
dateVar.getMinutes() - Tr¶ l¹i phót (0-59) cho dateVar.
dateVar.getSeconds() - Tr¶ l¹i gi©y (0-59) cho dateVar.
dateVar.getTime() - Tr¶ l¹i sè lîng c¸c mili gi©y tõ 00:00:00 ngµy 1/1/1970.
dateVar.getTimeZoneOffset() - Tr¶ l¹i ®é dÞch chuyÓnb»ng phót cña giê ®Þa ph¬ng hiÖn t¹i so víi giê quèc tÕ GMT.
dateVar.getYear()-Tr¶ l¹i n¨m cho dateVar.
Date.parse (dateStr) - Ph©n tÝch chuçi dateStr vµ tr¶ l¹i sè lîng c¸c mili gi©y tÝnh tõ 00:00:00 ngµy 01/01/1970.
dateVar.setDay(day) - §Æt ngµy trong th¸ng lµ day cho dateVar.
dateVar.setHours(hours) - §Æt giê lµ hours cho dateVar.
dateVar.setMinutes(minutes) - §Æt phót lµ minutes cho dateVar.
dateVar.setMonths(months) - §Æt th¸ng lµ months cho dateVar.
dateVar.setSeconds(seconds) - §Æt gi©y lµ seconds cho dateVar.
dateVar.setTime(value) - §Æt thêi gian lµ value, trong ®ã value biÓu diÔn sè lîng mili gi©y tõ 00:00:00 ngµy 01/01/10970.
dateVar.setYear(years) - §Æt n¨m lµ years cho dateVar.
dateVar.toGMTString() - Tr¶ l¹i chuçi biÓu diÔn dateVar díi d¹ng GMT.
dateVar.toLocaleString()-Tr¶ l¹i chuçi biÓu diÔn dateVar theo khu vùc thêi gian hiÖn thêi.
Date.UTC (year, month, day [,hours] [,minutes] [,seconds]) - Tr¶ l¹i sè lîng mili gi©y tõ 00:00:00 01/01/1970 GMT.
§èi tîng String
§èi tîng String lµ ®èi tîng ®îc x©y dùng néi t¹i trong JavaScript cung cÊp nhiÒu ph¬ng thøc thao t¸c trªn chuçi. §èi tîng nµy cã thuéc tÝnh duy nhÊt lµ ®é dµi (length) vµ kh«ng cã ch¬ng tr×nh xö lý sù kiÖn.
C¸c ph¬ng thøc
str.anchor (name) - §îc sö dông ®Ó t¹o ra thÎ (mét c¸ch ®éng). Tham sè name lµ thuéc tÝnh NAME cña thÎ .
str.big() - KÕt qu¶ gièng nh thÎ trªn chuçi str.
str.blink() - KÕt qu¶ gièng nh thÎ trªn chuçi str.
str.bold() - KÕt qu¶ gièng nh thÎ trªn chuçi str.
str.charAt(a) - Tr¶ l¹i ký tù thø a trong chuçi str.
str.fixed() - KÕt qu¶ gièng nh thÎ trªn chuçi str.
str.fontcolor() - KÕt qu¶ gièng nh thÎ .
str.fontsize(size) - KÕt qu¶ gièng nh thÎ .
str.index0f(srchStr [,index]) - Tr¶ l¹i vÞ trÝ trong chuçi str vÞ trÝ xuÊt hiÖn ®Çu tiªn cña chuçi srchStr. Chuçi str ®îc t×m tõ tr¸i sang ph¶i. Tham sè index cã thÓ ®îc sö dông ®Ó x¸c ®Þnh vÞ trÝ b¾t ®Çu t×m kiÕm trong chuçi.
str.italics() - KÕt qu¶ gièng nh thÎ trªn chuçi str.
str.lastIndex0f(srchStr [,index]) - Tr¶ l¹i vÞ trÝ trong chuçi str vÞ trÝ xuÊt hiÖn cuèi cïng cña chuçi srchStr. Chuçi str ®îc t×m tõ ph¶i sang tr¸i. Tham sè index cã thÓ ®îc sö dông ®Ó x¸c ®Þnh vÞ trÝ b¾t ®Çu t×m kiÕm trong chuçi.
str.link(href) - §îc sö dông ®Ó t¹o ra mét kÕt nèi HTML ®éng cho chhuçi str. Tham sè href lµ URL ®Ých cña liªn kÕt.
str.small() - KÕt qu¶ gièng nh thÎ trªn chuçi str.
str.strike() - KÕt qu¶ gièng nh thÎ trªn chuçi str.
str.sub() - T¹o ra mét subscript cho chuçi str, gièng thÎ .
str.substring(a,b) - Tr¶ l¹i chuçi con cña str lµ c¸c ký tù tõ vÞ trÝ thø a tíi vÞ trÝ thø b. C¸c ký tù ®îc ®Õm tõ tr¸i sang ph¶i b¾t ®Çu tõ 0.
str.sup() - T¹o ra superscript cho chuçi str, gièng thÎ .
str.toLowerCase() - §æi chuçi str thµnh ch÷ thêng.
str.toUpperCase() - §æi chuçi str thµnh ch÷ hoa.
C¸c phÇn tö cña ®èi tîng Form
Form ®îc t¹o bëi c¸c phÇn tö cho phÐp ngêi sö dông ®a th«ng tin vµo. Khi ®ã, néi dung (hoÆc gi¸ trÞ) cña c¸c phÇn tö sÏ ®îc chuyÓn ®Õn mét ch¬ng tr×nh trªn server qua mét giao diÖn ®îc gäi lµ Common Gateway Interface(Giao tiÕp qua mét cæng chung) gäi t¾t lµ CGI
Sö dông JavaScript b¹n cã thÓ viÕt nh÷ng ®o¹n scripts chÌn vµo HTML cña b¹n ®Ó lµm viÖc víi c¸c phÇn tö cña form vµ c¸c gi¸ trÞ cña chóng.
B¶ng ?: C¸c phÇn tö cña form
PhÇn tö
M« t¶
button
Lµ mét nót bÊm h¬n lµ nót submit hay nót reset
()
checkbox
Mét checkbox ()
FileUpload
Lµ mét phÇn tö t¶i file lªn cho phÐp ngêi sö dông göi lªn mét file ()
hidden
Mét trêng Èn ()
password
Mét trêng text ®Ó nhËp mËt khÈu mµ tÊt c¶ c¸c ký tù nhËp vµo ®Òu hiÓn thÞ lµ dÊu (*)()
radio
Mét nót bÊm ()
reset
Mét nót reset()
select
Mét danh s¸ch lùa chän
(option1
option2)
submit
Mét nót submit ()
text
Mét trêng text ()
textArea
Mét trêng text cho phÐp nhËp vµp nhiÒu dßng
default text)
Mçi phÇn tö cã thÓ ®îc ®Æt tªn ®Ó JavaScript truy nhËp ®Õn chóng qua tªn
Thuéc tÝnh type
Trong mçi phÇn tö cña form ®Òu cã thuéc tÝnh type, ®ã lµ mét x©u chØ ®Þnh râ kiÓu cña phÇn tö ®îc ®a vµo nh nót bÊm, mét trêng text hay mét checkbox...
X©u ®ã cã thÓ lµ mét trong c¸c gi¸ trÞ sau:
Text field: "text"
Radio button: "radio"
Checkbox: "checkbox"
Hidden field: "hidden"
Submit button: "submit"
Reset button: "reset"
Password field: "password"
Button: "button"
Select list: "select-one"
Multiple select lists: "select-multiple"
Textarea field: "textarea"
PhÇn tö button
Trong mét form HTML chuÈn, chØ cã hai nót bÊm cã s½n lµ submit vµ reset bëi vÞ d÷ liÖu trong form ph¶i ®îc göi tíi mét vµi ®Þa chØ URL (thêng lµ CGI-BIN script) ®Ó xö lý vµ lu tr÷.
Mét phÇn tö button ®îc chØ ®Þnh râ khi sö dông thÎ INPUT:
Trong thÎ INPUT, name lµ tªn cña button, thuéc tÝnh VALUE cã chøa nh·n cña button sÏ ®îc hiÓn thÞ trªn Navigator cña browser.
ChØ cã mét thÎ sù kiÖn duy nhÊt ®èi víi button lµ onClick. KÕt hîp víi nã lµ c¸ch thøc duy nhÊt click.PhÇn tö buttton cã kh¶ n¨ng më réng cho phÐp ngêi lËp tr×nh JavaScript cã thÓ viÕt ®îc mét ®o¹n m· lÖnh JavaScript ®Ó thùc thi viÖc thªm vµo mét nót bÊm trong mét script.
Trong vÝ dô sau, thay v× sö dông onChange, b¹n cã thÓ chØnh söa script ®Ó ®Þnh gi¸ biÓu thøc khi button ®îc bÊm.
VÝ dô: §Þnh gi¸ mét form sö dông phÇn tö button.
button Example
<!-- HIDE FROM OTHER BROWSERS
function calculate(form) {
form.results.value = eval(form.entry.value);
}
// STOP HIDING FROM OTHER BROWSERS -->
Enter a JavaScript mathematical expression:
The result of this expression is:
PhÇn tö checkbox
C¸c phÇn tö checkbox cã kh¶ n¨ng bËt t¾t dïng ®Ó chän hoÆc kh«ng chän mét th«ng tin. C¸c checkbox cã nhiÒu thuéc tÝnh vµ c¸ch thøc h¬n button. B¶ng díi ®©y lµ danh s¸ch c¸c thuéc tÝnh vµ c¸c c¸ch thøc cña phÇn tö checkbox.
B¶ng . C¸c thuéc tÝnh vµ c¸ch thøc cña phÇn tö checkbox.
C¸ch thøc vµ thuéc tÝnh
M« t¶
checked
Cho biÕt tr¹ng th¸i hiÖn thêi cña checkbox (thuéc tÝnh)
defaultChecked
Cho biÕt tr¹ng th¸i mÆc ®Þnh cña phÇn tö (thuéc tÝnh)
name
Cho biÕt tªn cña phÇn tö ®îc chØ ®Þnh trong thÎ INPUT (thuéc tÝnh)
value
Cho biÕt gi¸ trÞ hiÖn thêi cña phÇn tö ®îc chØ ®Þnh trong thÎ INPUT (thuéc tÝnh)
click()
M« t¶ mét click vµo checkbox (C¸ch thøc)
PhÇn tö checkbox chØ cã mét thÎ sù kiÖn lµ onClick
VÝ dô: T¹o hép checkbox ®Ó nhËp vµo mét sè råi lùa chän tÝnh nh©n ®«i vµ b×nh ph¬ng:
checkbox Example
<!-- HIDE FROM OTHER BROWSERS
function calculate(form,callingField) {
if (callingField == "result") { // if(1)
if (form.square.checked) { // if(2)
form.entry.value = Math.sqrt(form.result.value);
}
else {
form.entry.value = form.result.value / 2;
} //end if(2)
}
else{
if (form.square.checked) { // if(3)
form.result.value=form.entry.value*form.entry.value;
}
else {
form.result.value = form.entry.value * 2;
} //enfzd if(3)
}//end if(1)
}//end function
// STOP HIDING FROM OTHER BROWSERS -->
Value: <INPUT TYPE="text" NAME="entry" VALUE=0
onChange="calculate(this.form,this.name);">
Action (default double): <INPUT TYPE=checkbox NAME=square
onClick="calculate(this.form,this.name);">
Square
Result: <INPUT TYPE="text" NAME="result" VALUE=0
onChange="calculate(this.form,this.name);">
Trong script nµy, b¹n ®· thÊy c¸ch sö dông thÎ sù kiÖn onClick còng nh thuéc tÝnh checked lµ mét gi¸ trÞ kiÓu Boolean cã thÓ dïng lµm ®iÒu kiÖn trong c©u lÖnh if...else
B¹n cã thÓ thªm mét checkbox tªn lµ square vµo form. NÕu hép nµy ®îc check, ch¬ng tr×nh sÏ lÊy gi¸ trÞ cña nã, nÕu kh«ng, mét thùc thi ®îc mÆc ®Þnh sÏ nh©n ®«i gi¸ trÞ cña nã. ThÎ sù kiÖn onClick trong checkbox ®îc ®Þnh nghÜa:
( )
Khi ®ã nÕu ngêi dïng thay ®æi mét c©u lÖnh kh¸c, form sÏ ®îc tÝnh to¸n l¹i.
§Ó t¹o ra sù më réng cho checkbox. b¹n cã thÓ thay ®æi hµm calculate() nh sau:
function calculate(form,callingField) {
if (callingField == "result") { // if (1)
if (form.square.checked) { // if (2)
form.entry.value = Math.sqrt(form.result.value);
}
else {
form.entry.value = form.result.value / 2;
} //end if(2)
}
else {
if (form.square.checked) { // if (3)
form.result.value=form.entry.value*form.entry.value;
}
else {
form.result.value = form.entry.value * 2;
} // end if (3)
} // end if (1)
}
PhÇn tö File Upload
PhÇn tö nµy cung cÊp cho form mét c¸ch ®Ó ngêi sö dông cã thÓ chØ râ mét file ®a vµo form xö lý. PhÇn tö file Upload ®îc chØ ®Þnh râ trong JavaScript b»ng ®èi tîng FileUpload.
§èi tîng chØ cã hai thuéc tÝnh lµ name vµ value, c¶ hai ®Òu lµ gi¸ trÞ x©u nh c¸c ®èi tîng kh¸c. Kh«ng cã c¸ch thøc hay thÎ file cho ®èi tîng nµy.
PhÇn tö hidden
PhÇn tö hidden lµ phÇn tö duy nhÊt trong sè tÊt c¶ c¸c phÇn tö cña form kh«ng ®îc hiÓn thÞ trªn Web browser. Trêng hidden cã thÓ sö dông ®Ó lu c¸c gi¸ trÞ cÇn thiÕt ®Ó göi tíi server song song víi sù xuÊt ra tõ form (form submission) nhng nã kh«ng ®îc hiÓn thÞ trªn trang. Mäi ngêi cã thÓ sö dông trong JavaScript ®Ó lu c¸c gi¸ trÞ trong suèt mét script vµ ®Ó tÝnh to¸n kh«ng cÇn form.
§èi tîng hidden chØ cã hai thuéc tÝnh lµ name vµ value, ®ã còng lµ nh÷ng gi¸ trÞ x©u gièng c¸c ®èi tîng kh¸c. Kh«ng cã c¸ch thøc hay thÎ sù kiÖn nµo cho ®èi tîng nµy.
PhÇn tö Password
§èi tîng Password lµ ®èi tîng duy nhÊt trong c¸c ®èi tîng cña form mµ khi gâ bÊt kú ký tù nµo vµo còng ®Òu hiÓn thÞ dÊu sao(*). Nã cho phÐp ®a vµo nh÷ng th«ng tin bÝ mËt nh ®¨ng ký mËt khÈu...
§èi tîng Password cã 3 thuéc tÝnh gièng trêng text lµ: defaultValue, name vµ value. Kh«ng gièng víi hai phÇn tö ë trªn, trêng Password cã nhiÒu c¸ch thøc h¬n(focus(), blur(), and select() ) vµ t¬ng øng víi c¸c thÎ sù kiÖn: onFocus, onBlur, and onSelect.
PhÇn nµy sÏ ®îc nãi kü h¬n trong ®èi tîng text.
PhÇn tö radio
§èi tîng radio gÇn gièng sù bËt t¾t checkbox khi cã hai nót radio kÕt hîp thµnh mét nhãm. Khi nhiÒu radio ®îc kÕt hîp thµnh mét nhãm, chØ cã mét nót ®îc chän trong bÊt kú mét thêi ®iÓm nµo. VÝ dô dßng lÖnh sau t¹o ra mét nhãm radio cã ba nót tªn lµ test:
1
2
3
Nhãm c¸c nót radio l¹i b»ng c¸ch ®Æt cho chóng cã cïng mét tªn trong c¸c thÎ INPUT.
Cã mét vµi thuéc tÝnh ®Ó kiÓm tra tr¹ng th¸i hiÖn thêi cña mét nhãm nót radio. B¶ng sau hiÓn thÞ c¸c thuéc tÝnh vµ c¸ch thøc cña ®èi tîng radio.
B¶ng? . C¸c thuéc tÝnh vµ c¸ch thøc cña ®èi tîng radio.
Thuéc tÝnh vµ c¸ch thøc
M« t¶
checked
M« t¶ tr¹ng th¸i hiÖn thêi cña phÇn tö radio (thuéc tÝnh)
defaultChecked
M« t¶ tr¹ng th¸i mÆc ®Þnh cña phÇn tö (thuéc tÝnh)
index
M« t¶ thø tù cña nót radio ®îc chän hiÖn thêi trong mét nhãm
length
M« t¶ tæng sè nót radio trong mét nhãm
name
M« t¶ tªn cña phÇn tö ®îc chØ ®Þnh trong thÎ INPUT (thuéc tÝnh)
value
M« t¶ gi¸ trÞ hiÖn thêi cña phÇn tö ®îc ®Þnh ra trong thÎ INPUT (thuéc tÝnh)
click()
M« pháng mét click trªn nót radio (c¸ch thøc)
Còng nh checkbox, radio chØ cã mét thÎ sù kiÖn lµ onClick.
Kh«ng cã bÊt kú mét ®èi tîng form nµo cã thuéc tÝnh index vµ length. Do mét nhãm radio gåm nhiÒu phÇn tö radio, nªn chóng ®îc ®Æt trong mét m¶ng c¸c nót radio vµ ®îc ®¸nh sè tõ 0. Trong vÝ dô nhãm radio cã tªn test ë trªn, nÕu nhãm ®ã n»m trong mét form cã tªn lµ "testform", b¹n cã thÓ gäi tíi nót radio thø hai b»ng tªn "testform.test[1]" vµ cã thÓ kiÓm tra gi¸ trÞ cña nã b»ng "testform.test[1].checked"
§Ó minh ho¹ râ c¸ch dïng ®èi tîng radio, ta xem vÝ dô sau:
VÝ dô:
radio button Example
<!-- HIDE FROM OTHER BROWSERS
function calculate(form,callingField) {
if (callingField == "result") {
if (form.action[1].checked) {
form.entry.value = Math.sqrt(form.result.value);
} else {
form.entry.value = form.result.value / 2;
}
} else {
if (form.action[1].checked) {
form.result.value=form.entry.value*form.entry.value;
} else {
form.result.value = form.entry.value * 2;
}
}
}
// STOP HIDING FROM OTHER BROWSERS -->
Value: <INPUT TYPE="text" NAME="entry" VALUE=0
onChange="calculate(this.form,this.name);">
Action:
<INPUT TYPE="radio" NAME="action" VALUE="twice"
onClick="calculate(this.form,this.name);"> Double
<INPUT TYPE="radio" NAME="action" VALUE="square"
onClick="calculate(this.form,this.name);"> Square
Result: <INPUT TYPE=text NAME="result" VALUE=0
onChange="calculate(this.form,this.name);">
Trong vÝ dô nµy, sù thay ®æi tõ checkbox ë trªn lµ rÊt khã nhËn biÕt. Thay cho mét checkbox trong vÝ dô tríc, ë ®©y ta sö dông hai nót radio víi hai gi¸ trÞ kh¸c nhau: double vµ square
Nh ta ®· biÕt cã thÓ truy nhËp ®Õn c¸c nót radio qua mét m¶ng, do ®ã hai nót nµy cã thÓ truy nhËp b»ng action[0] vµ action[1]. B»ng c¸ch nµy, b¹n chØ cÇn thay ®æi tham chiÕu ®Õn hµm calculate() tõ form.square.checked thµnh form.action[1].checked.
PhÇn tö reset
Sö dông ®èi tîng reset, b¹n cã thÓ t¸c ®éng ngîc l¹i ®Ó click vµo nót Reset. Còng gièng ®èi tîng button, ®èi tîng reset cã hai thuéc tÝnh lµ name vµ value, vµ mét c¸ch thøc click(), mét thÎ sù kiÖn onClick.
HÇu hÕt nh÷ng ngêi lËp tr×nh khong sö dông thÎ sù kiÖn onClick cña nót reset ®Ó kiÓm tra gi¸ trÞ cña nót nµy, ®èi tîng reset thêng dïng ®Ó xo¸ form.
VÝ dô sau minh ho¹ c¸ch sö dông nót reset ®Ó xo¸ c¸c gi¸ trÞ cña form.
VÝ dô:
reset Example
<!-- HIDE FROM OTHER BROWSERS
function clearForm(form) {
form.value1.value = "Form";
form.value2.value = "Cleared";
}
// STOP HIDING FROM OTHER BROWSERS -->
//SCRIPT>
PhÇn tö select
Danh s¸ch lùa chän trong c¸c form HTML xuÊt hiÖn menu drop-down hoÆc danh s¸ch cuén ®îc cña c¸c ®èi tîng cã thÓ ®îc lùa chän. C¸c danh d¸ch ®îc x©y dùng b»ng c¸ch sö dông hai thÎ SELECT vµ OPTION. VÝ dô:
1
2
3
t¹o ra ba thµnh phÇn cña menu th¶ drop-down víi ba lùa chän 1,2 vµ 3. Sö dông thuéc tÝnh SIZE b¹n cã thÓ t¹o ta mét danh s¸ch cuén víi sè phÇn tö hiÓn thÞ ë lÇn thø nhÊt. §Ó bËt menu drop-down trong mét menu cuén víi hai thµnh phÇn hiÓn thÞ, b¹n cã thÓ sö dông nh sau:
1
2
3
Trong c¶ hai vÝ dô trªn, ngêi sö dông chØ cã thÓ cã mét lùa chän. NÕu sö dông thuéc tÝnh MULTIPLE, b¹n cã thÓ cho phÐp ngêi sö dông lùa chän nhiÒu h¬n mét gi¸ trÞ trong danh s¸ch lùa chän:
1
2
3
Danh s¸ch lùa chän trong JavaScript lµ ®èi tîng select. §èi tîng nµy t¹o ra mét vµi thµnh phÇn t¬ng tù c¸c button vµ radio.
Víi c¸c thµnh phÇn lùa chän, danh s¸ch c¸c lùa chän ®îc chøa trong mét m¶ng ®îc ®¸nh sè tõ 0. Trong trêng hîp nµy, m¶ng lµ mét thuéc tÝnh cña ®èi tîng select gäi lµ options.
C¶ viÖc lùa chän c¸c option vµ tõng phÇn tö option riªng biÖt ®Òu cã nh÷ng thuéc tÝnh. Bæ sung thªm vµo m¶ng option, phÇn tö select cã thuéc tÝnh selectedIndex, cã chøa sè thø tù cña option ®îc lùa chän hiÖn thêi.
Mçi option trong danh s¸ch lùa chän ®Òu cã mét vµi thuéc tÝnh:
DEFAULTSELECTED: cho biÕt option cã ®îc mÆc ®Þnh lµ lùa chän trong thÎ OPTION hay kh«ng.
INDEX: chøa gi¸ trÞ sè thø tù cña option hÞªn thêi trong m¶ng option.
SELECTED: cho biÕt tr¹ng th¸i hiÖn thêi cña option
TEXT: cã chøa gi¸ trÞ cña dßng text hiÓn thÞ trªn menu cho mçi option, vµ thuéc tÝnh value mäi gi¸ trÞ chØ ra trong thÎ OPTION.
§èi tîng select kh«ng cã c¸c c¸ch thøc ®îc ®Þnh nghÜa s½n. Tuy nhiªn, ®èi tîng select cã ba thÎ sù kiÖn, ®ã lµ onBlue, onFocus, onChange, chóng ®Òu lµ nh÷ng ®èi tîng text.
VÝ dô b¹n cã danh s¸ch lùa chän sau:
1
2
3
Khi lÇn ®Çu tiªn hiÓn thÞ b¹n cã thÓ truy nhËp tíi c¸c th«ng tin sau:
example.options[1].value = "The Second"
example.options[2].text = "3"
example.selectedIndex = 0
example.options[0].defaultSelected = true
example.options[1].selected = false
NÕu ngêi sö dông kÝch vµo menu vµ lùa chän option thø hai, th× thÎ onFocus sÏ thùc hiÖn, vµ khi ®ã gi¸ trÞ cña thuéc tÝnh sÏ lµ:
example.options[1].value = "The Second"
example.options[2].text = "3"
example.selectedIndex = 1
example.options[0].defaultSelected = true
example.options[1].selected = true
Söa c¸c danh s¸ch lùa chän
Navigator 3.0 cho phÐp thay ®æi néi dung cña danh s¸ch lùa chän tõ JavaScript b»ng c¸ch liªn kÕt c¸c gi¸ trÞ míi cho thuéc tÝnh text cña c¸c thùc thÓ trong danh s¸ch.
VÝ dô, trong vÝ dô tríc, b¹n ®· t¹o ra mét danh s¸ch lùa chän nh sau:
1
2
3
Cã thÓ thay ®æi ®îc dßng text hiÓn thÞ trªn nót thø hai thµnh "two" b¨ng:
example.options[1].text = "two";
Cã thÓ thªm c¸c lùa chän míi vµo danh s¸ch b»ng c¸ch sö dông ®èi tîng x©y dùng Option() theo có ph¸p:
newOptionName = new Option(optionText, optionValue, defaultSelected, selected);
selectListName.options[index] = newOptionName;
ViÖc t¹o ®èi tîng option() nµy víi dßng text ®îc chØ tríc, defaultSelected vµ selected nh trªn ®· ®Þnh ra nh÷ng gi¸ trÞ kiÓu Boolean. §èi tîng nµy ®îc liªn kÕt vµo danh s¸ch lùa chän ®îc thùc hiÖn b»ng index.
C¸c lùa chän cã thÓ bÞ xo¸ trong danh s¸ch lùa chän b»ng c¸ch g¾n gi¸ trÞ null cho ®èi tîng muèn xo¸
selectListName.options[index] = null;
PhÇn tö submit
Nót Submit lµ mét trêng hîp ®Æc biÖt cña button, còng nh nót Reset. Nót nµy ®a th«ng tin hiÖn t¹i tõ c¸c trêng cña form tíi ®Þa chØ URL ®îc chØ ra trong thuéc tÝnh ACTION cña thÎ form sö dông c¸ch thøc METHOD chØ ra trong thÎ FORM.
Gièng nh ®èi tîng button vµ reset, ®èi tîng submit cã s½n thuéc tÝnh name vµ value, c¸ch thøc click() vµ thÎ sù kiÖn onClick.
PhÇn tö Text
PhÇn tö nµy n»m trong nh÷ng phÇn tö hay ®îc sö dông nhÊt trong c¸c form HTML. T¬ng tù nh trêng Password, trêng text cho phÐp nhËp vµo mét dßng ®¬n, nhng c¸c ký tù cña nã hiÖn ra b×nh thêng.
®èi tîng text cã ba thuéc tÝnh:defautValue, name vµ value. Ba c¸ch thøc m« pháng sù kiÖn cña ngêi sö dông: focus(), blur() vµ select(). Cã 4 thÎ sù kiÖn lµ: obBlur, onFocus, onChange, onSelect. Chó ý c¸c sù kiÖn nµy chØ thùc hiÖn khi con trá ®· ®îc kÝch ra ngoµi trêng text.
B¶ng sau m« t¶ c¸c thuéc tÝnh vµ c¸ch thøc cña ®èi tîng text.
B¶ng .C¸c thuéc tÝnh vµ c¸ch thøc cña ®èi tîng text.
C¸ch thøc vµ thuéc tÝnh
M« t¶
defaultValue
ChØ ra gi¸ trÞ mÆc ®Þnh cña phÇn tö ®îc chØ ra trong thÎ INPUT (thuéc tÝnh)
name
Tªn cña ®èi tîng ®îc chØ ra trong thÎ INPUT (thuéc tÝnh)
value
Gi¸ trÞ hiÖn thêi cña phÇn tö (thuéc tÝnh)
focus()
M« t¶ viÖc con trá tíi trêng text (c¸ch thøc)
blur()
M« t¶ viÖc con trá rêi trêng text (c¸ch thøc)
select()
M« t¶ viÖc lùa chän dßng text trong trêng text (c¸ch thøc)
Mét chó ý quan träng lµ cã thÓ g¸n gi¸ trÞ cho trêng text b»ng c¸ch liªn kÕt c¸c gi¸ trÞ víi thuéc tÝnh value. Trong vÝ dô sau ®©y, dßng text ®îc ®a vµo trêng ®Çu tiªn ®îc lÆp l¹i trong trêng text thø hai, vµ mäi dßng text ®îc ®a vµo trêng text thø hai l¹i ®îc lÆp l¹i trong trêng texxt thø nhÊt. Kh¶ n¨ng nµy cña nã cã thÓ ¸p dông ®Ó tù ®éng cËp nhËt hoÆc thay ®æi d÷ liÖu.
VÝ dô. Tù ®éng cËp nhËt c¸c trêng text .
text Example
<!-- HIDE FROM OTHER BROWSERS
function echo(form,currentField) {
if (currentField == "first")
form.second.value = form.first.value;
else
form.first.value = form.second.value;
}
// STOP HIDING FROM OTHER BROWSERS -->
PhÇn tö Textarea
ThÎ TEXTAREA cung cÊp mét hép cho phÐp nhËp sè dßng text do ngêi thiÕt kÕ ®Þnh tríc. VÝ dô:
Default Text Here
vÝ dô nµy t¹o ra mét trêng text cho phÐp ®a vµo 10 hµng ,mçi hµng 25 ký tù. Dßng "Defautl Text Here"sÏ xuÊt hiÖn trong trêng nµy vµo lÇn hiÓn thÞ ®Çu tiªn.
Còng nh phÇn tö text , JavaScript cung cÊp cho b¹n c¸c thuéc tÝnh defaultValue, name, vµ value, c¸c c¸ch thøc focus(), select(), vµ blur(), c¸c thÎ sù kiÖn onBlur, onForcus, onChange, onSelect.
M¶ng elements[]
C¸c ®èi tîng cña form cã thÓ ®îc gäi tíi b»ng m¶ng elements[]. VÝ dô b¹n t¹o ra mét form sau:
b¹n cã thÓ gäi tíi ba thµnh phÇn nµy nh sau: document.elements[0], document.elements[1], document.elements[2], h¬n n÷a cßn cã thÓ gäi document.testform.one, document.testform.two,
document.testform.three.
Thuéc tÝnh nµy thêng ®îc sö dông trong c¸c mèi quan hÖ tuÇn tù cña c¸c phÇn tö h¬n lµ dïng tªn cña chóng.
M¶ng form[]
C¸c thÎ sù kiÖn ®îc thiÕt kÕ ®Ó lµm viÖc víi c¸c form riªng biÖt hoÆc c¸c trêng ë mét thêi ®iÓm, nã rÊt h÷u dông ®Ó cho phÐp gäi tíi c¸c form cã liªn quan trong cïng mét trang.
M¶ng form[] ®Ò cËp ®Õn ë ®©y cã thÓ cã nhiÒu x¸c ®Þnh c¸c nh©n cña form trªn cïng mét trang vµ have information in a single field match in all three forms. Cã thÓ gäi b»ng document.forms[] thay v× gäi b»ng tªn form. Trong script nµy, b¹n cã hai trêng text ®Ó nhËp vµ n»m trªn hai form ®éc lËp víi nhau. Sö dông m¶ng form b¹n cã thÓ t¬ng t¸c trªn c¸c gi¸ trÞ cña c¸c trêng trong hai form cïng mét lóc khi ngêi sö dông thay ®æi gi¸ trÞ trªn mét form.
forms[] Example
MÆt kh¸c, b¹n còng cã thÓ truy nhËp ®Õn form b»ng tªn form ®îc ®Æt trong thÎ FORM:
Khi ®ã b¹n cã thÓ gäi lµ document.forms["name"] hoÆc document.name
Xem l¹i c¸c lÖnh vµ më réng
LÖnh/ Më réng
KiÓu
M« t¶
blur()
c¸ch thøc JavaScript
M« t¶ viÖc dÞch chuyÓn con trá tõ mét phÇn tö
form.action
c¸ch thøc JavaScript
X©u chøa gi¸ trÞ cña thuéc tÝnh ACTION trong thÎ FORM
form.elemrnts
thuéc tÝnh JavaScript
m¶ng chøa danh s¸ch c¸c phÇn tö trong form (nh checkbox, trêng text, danh s¸ch lùa chän)
form.encoding
thuéc tÝnh JavaScript
x©u chøa kiÓu MIME sö dông khi chuyÓn th«ng tin tõ form tíi server
form,name
thuéc tÝnh JavaScript
X©u chøa gi¸ trÞ thuéc tÝnh NAME trong thÎ FORM
form.target
thuéc tÝnh JavaScript
X©u chøa tªn cöa sæ ®Ých bëi mét form submition
form.submit
c¸ch thøc JavaScript
M« t¶ viÖc submit mét form HTML
type
thuéc tÝnh JavaScript
¸nh x¹ kiÓu cña mét phÇn tö form thµnh mét x©u.
onSubmit
ThÎ sù kiÖn
thÎ sù kiÖn cho viÖc submit
button
thuéc tÝnh HTML
Thuéc tÝnh kiÓu cho c¸c nót bÊm cña HTML ()
checkbox
thuéc tÝnh HTML
Thuéc tÝnh kiÓu cho c¸c checkbox cña HTML ()
pasword
thuéc tÝnh HTML
Thuéc tÝnh kiÓu cho c¸c dßng pasword cña HTML()
radio
thuéc tÝnh HTML
Thuéc tÝnh kiÓu cho c¸c nót radio cña HTML ()
reset
thuéc tÝnh HTML
Thuéc tÝnh kiÓu cho c¸c nót reset cña HTML ()
SELECT
thÎ HTML
Hép thÎ cho danh s¸ch lùa chän
OPTION
thÎ HTML
chØ ra c¸c lùa chän trong danh s¸ch lùa chän(Option 1Option 2)
submit
thuéc tÝnh HTML
Thuéc tÝnh kiÓu cña nót submit ()
text
thuéc tÝnh HTML
Thuéc tÝnh kiÓu cña trêng trong form ()
TEXTAREA
ThÎ HTML
Hép thÎ cho nhiÒu dßng text ( defautl text )
name
thuéc tÝnh JavaScript
X©u chøa tªn phÇn tö HTML (button, checkbox, password...)
value
thuéc tÝnh JavaScript
X©u chøa gi¸ trÞ hiªn thêi cña mét phÇn tö HTML(button, checkbox, password...)
click()
c¸ch thøc JavaScript
M« t¶ viÖc kÝch vµo mét phÇn tö trªn form (button, checkbox,password)
onClick
thuéc tÝnh JavaScript
ThÎ sù kiÖn cho sù kiÖn kÝch (button, checkbox, radio button, reset, selection list, submit)
checked
thuéc tÝnh JavaScript
Gi¸ trÞ kiÓu Boolean m« t¶ mét lùa chän check(checkbox, radio button)
defaultChecked
thuéc tÝnh JavaScript
X©u chøa gi¸ trÞ mÆc ®Þnh cña mét phÇn tö HTML (password, text, textarea)
focus()
c¸ch thøc JavaScript
M« t¶ viÖc con trá tíi mét phÇn tö (password, text, textarea)
blur()
c¸ch thøc JavaScript
M« t¶ viÖc con trá rêi khái mét phÇn tö (password, text, textarea)
select()
c¸ch thøc JavaScript
M« t¶ viÖc lùa chän dßng text trong mét trêng (password, text, textarea)
onFocus()
ThÎ sù kiÖn
ThÎ sù kiÖn cho sù kiÖn focus(password, selection list, text, textarea)
onBlur
ThÎ sù kiÖn
ThÎ sù kiÖn cho sù kiÖn blur (password, selection list, text, textarea)
onChange
ThÎ sù kiÖn
ThÎ sù kiÖn cho sù kiÖn khi gi¸ trÞ cña trêng thay ®æi (password, selection list, text, textarea)
onSelect
ThÎ sù kiÖn
ThÎ sù kiÖn khi ngêi sö dông chän dßng text trong mét trêng (password, text, textarea)
index
thuéc tÝnh JavaScript
Lµ mét sè nguyªn m« t¶ lùa chän hiÖn thêi trong mét nhãm lùa chän (radio button)
length
thuéc tÝnh JavaScript
Sè nguyªn m« t¶ tæng sè c¸c lùa chän trong mét nhãm c¸c lùa chän (radio button)
dafautlSelected
thuéc tÝnh JavaScript
Gi¸ trÞ Boolean m« t¶ khi cã mét lùa chän ®îc ®Æt lµ mÆc ®Þnh (seledtion list)
options
thuéc tÝnh JavaScript
M¶ng c¸c lùa chän trong danh s¸ch lùa chän
text
thuéc tÝnh JavaScript
Dßng text hiÓn thÞ cho mét thµnh phÇn cña menu trong danh s¸ch lùa chän
TABLE
thÎ HTML
Hép thÎ cho c¸c b¶ng HTML
TR
thÎ HTML
Hép thÎ cho c¸c hµng cña mét b¶ng HTML
TD
thÎ HTML
Hép thÎ cho c¸c « cña mét hµng trong mét b¶ng HTML
COLSPAN
thuéc tÝnh HTML
Lµ thuéc tÝnh cña thÎ TD m« t¶ trong mét « cña b¶ng cã nhiÒu cét
ROWSPAN
thuéc tÝnh HTML
Lµ thuéc tÝnh cña thÎ TD m« t¶ trong mét « cña b¶ng cã nhiÒu hµng
BODER
thuéc tÝnh HTML
Lµ thuéc tÝnh cña thÎ TABLE m« t¶ ®é réng ®êng viÒn cña b¶ng
document.forms[]
thuéc tÝnh JavaScript
m¶ng cña c¸c ®èi tîng form víi mét danh s¸ch c¸c form trong mét document
string.substring()
c¸ch thøc JavaScript
Tr¶ l¹i mét x©u con cña x©u string tõ tham sè vÞ trÝ ký tù ®Çu ®Õn vÞ trÝ ký tù cuèi
Math.floor()
c¸ch thøc JavaScript
Tr¶ l¹i mét gi¸ trÞ nguyªn tiÕp theo nhá h¬n gi¸ trÞ cña tham sè ®a vµo.
string.length
thuéc tÝnh JavaScript
Gi¸ trÞ nguyªn cña sè thø tù ký tù cuèi cïng trong x©u string
M« h×nh ®èi tîng (Object Model)
§èi tîng vµ thuéc tÝnh
Nh ®· biÕt, mét ®èi tîng trong JavaScript cã c¸c thuéc tÝnh ®i kÌm víi nã. B¹n cã thÓ truy nhËp ®Õn c¸c thuéc tÝnh cña nã b»ng c¸ch gäi :
objectName.propertyName
C¶ tªn ®èi tîng vµ tªn thuéc tÝnh ®Òu nh¹y c¶m. B¹n ®Þnh nghÜa mét thuéc tÝnh b»ng c¸ch g¸n cho nã mét gi¸ trÞ. VÝ dô, gi¶ sö cã mét ®èi tîng tªn lµ myCar (trong trêng hîp nµy gi¶ sö ®èi tîng nµy ®· tån t¹i s½n sµng). B¹n cã thÓ lÊy c¸c thuéc tÝnh cã tªn make, model vµ year cña nã nh sau:
myCar.make = “Ford“
myCar.model = “Mustang“
myCar.year = 69;
Cã mét m¶ng lu tr÷ tËp hîp c¸c gi¸ trÞ tham chiÕu tíi tõng biÕn. Thuéc tÝnh vµ m¶ng trong JavaScript cã quan hÖ mËt thiÕt víi nhau, thùc ra chóng chØ kh¸c nhau vÒ c¸ch giao tiÕp víi cïng mét cÊu tróc d÷ liÖu. VÝ dô còng cã thÓ truy nhËp tíi c¸c thuéc tÝnh cña ®èi tîng myCar ë trªn b»ng m¶ng nh sau:
myCar[make] = “Ford“
myCar[model] = “Mustang“
myCar[year] = 69;
KiÓu m¶ng nµy ®îc hiÓu nh mét m¶ng cã kh¶ n¨ng liªn kÕt bëi mçi mét phÇn tö trong ®ã ®Òu cã thÓ liªn kÕt ®Õn mét gi¸ trÞ x©u nµo ®ã. §Ó minh ho¹ viÖc mµy ®îc thùc hiÖn nh thÕ nµo, hµm sau ®©y sÏ hiÓn thÞ c¸c thuéc tÝnh cña mét ®èi tîng th«ng qua tham sè vÒ kiÓu ®èi tîng ®ã vµ tªn ®èi tîng.
function show_props (obj, obj_name)
{
var result=””
for (i in obj)
result=result+ obj_name + “.”+ i+ “=” + obj[i] + “\n”
return result
}
Khi gäi hµm show_props(myCar,”myCar”) sÏ hiÖn lªn:
myCar.make = Ford
myCar.model = Mustang
myCar.year = 69;
T¹o c¸c ®èi tîng míi
C¶ JavaScript client-side vµ server-side ®Òu cã mét sè ®èi tîng ®îc ®Þnh nghÜa tríc. Tuy nhiªn, b¹n còng cã thÓ t¹o ra nh÷ng ®èi tîng cña riªng b¹n. Trong JavaScript 1.2, nÕu b¹n chØ muèn t¹o ra mét ®èi tîng duy nhÊt cña mét kiÓu ®èi tîng, b¹n cã thÓ t¹o nã b»ng c¸ch sö dông khëi t¹o ®èi tîng. HoÆc nÕu b¹n muèn t¹o ra nhiÒu c¸ thÓ cña mét kiÓu ®èi tîng, b¹n cã thÓ t¹o ra mét hµm x©y dùng tríc, sau ®ã t¹o ra c¸c ®èi tîng cã kiÓu cña hµm ®ã b»ng to¸n tö new
Sö dông khëi t¹o ®èi tîng
Trong nh÷ng phiªn b¶n tríc cña Navigator, b¹n chØ cã thÓ t¹o ra mét ®èi tîng b»ng c¸ch sö dông hµm x©y dùng chóng hoÆc sö dông mét hµm ®îc cung cÊp bëi mét vµi ®èi tîng kh¸c ®Ó ®¹t ®îc môc ®Ých.
Tuy nhiªn, trong Navigator 4.0, b¹n cã thÓ t¹o ra mét ®èi tîng b»ng c¸ch sö dông mét khëi t¹o ®èi tîng.B¹n sö dông c¸ch nµy khi b¹n chØ muèn t¹o ra mét c¸ thÓ ®¬n lÎ chø kh«ng ph¶i nhiÒu c¸ thÓ cña ®èi tîng.
Có ph¸p ®Ó t¹o ra mét ®èi tîng b»ng c¸ch khëi t¹o ®èi tîng (Object Initializers):
objectName={property1: value1, property2: value2,
..., propertyN: valueN}
Trong ®ã objectName lµ tªn cña ®èi tîng míi, mçi propertyI lµ mét x¸c minh (cã thÓ lµ mét tªn, mét sè hoÆc mét x©u ký tù) vµ mçi valueI lµ mét biÓu thøc mµ gi¸ trÞ cña nã ®îc g¸n cho propertyI. Cã thÓ lùa chän khëi t¹o b»ng tªn ®èi tîng hoÆc chØ b»ng c¸c khai b¸o. NÕu nh b¹n kh«ng cÇn dïng ®Õn ®èi tîng ®ã trong mäi chç, b¹n kh«ng cÇn ph¶i g¸n nã cho mét biÕn.
NÕu mét ®èi tîng ®îc t¹o b»ng c¸ch khëi t¹o ®èi tîng ë møc cao nhÊt, mçi lÇn ®èi tîng ®ã xuÊt hiÖn trong c¸c biÓu thøc, JavaScript sÏ ®¸nh gi¸ l¹i nã mét lÇn. Ngoµi ra, nÕu sö dông viÖc khëi t¹o nµy trong mét hµm th× mçi lÇn gäi hµm, ®èi tîng sÏ ®îc khëi t¹o mét lÇn
Gi¶ sö b¹n cã c©u lÖnh sau:
if (condition)
x={hi: ”there.”}
Trong trêng hîp nµy, JavaScript sÏ t¹o ra mét ®èi tîng vµ g¾n nã vµo biÕn x nÕu biÓu thøc condition ®îc ®¸nh gi¸ lµ ®óng
Cßn vÝ dô sau t¹o ra mét ®èi tîng myHonda víi 3 thuéc tÝnh:
myHonda={color:”red”,wheels:4,engine:{cylinder:4,size:2.2}}
Chó ý r»ng thuéc tÝnh engine còng lµ mét ®èi tîng víi c¸c thuéc tÝnh cña nã
Trong Navigator 4.0, b¹n còng cã thÓ sö dông mét khëi t¹o ®Ó t¹o mét m¶ng. Có ph¸p ®Ó t¹o m¶ng b»ng c¸ch nµy kh¸c víi t¹o ®èi tîng:
arrayName=[element0, element1,...,elementN]
Trong ®ã, arrayName lµ tªn cña m¶ng míi, vµ mçi elementI lµ gi¸ trÞ cña phÇn tö ë vÞ trÝ ®ã cña m¶ng. Khi b¹n t¹o mét m¶ng b»ng c¸ch sö dông ph¬ng ph¸p khëi t¹o, th× nã sÏ coi mçi gi¸ trÞ lµ mét phÇn tö trªn m¶ng, vµ chiÒu dµi cña m¶ng chÝnh lµ sè c¸c tham sè.
B¹n kh«ng cÇn ph¶i chØ ®Þnh râ tÊt c¶ c¸c phÇn tö trªn m¶ng míi. NÕu b¹n ®Æt hai dÊu phÈy vµo hµng, th× m¶ng sÏ ®îc t¹o víi nh÷ng chèn trèng cho nh÷ng phÇn tö cha ®îc ®Þnh nghÜa nh vÝ dô díi ®©y:
NÕu mét m¶ng ®îc t¹o b»ng c¸ch khëi t¹o(initializer) ë møc cao nhÊt, mçi lÇn m¶ng ®ã xuÊt hiÖn trong c¸c biÓu thøc, JavaScript sÏ ®¸nh gi¸ l¹i nã mét lÇn. Ngoµi ra, nÕu sö dông viÖc khëi t¹o nµy trong mét hµm th× mçi lÇn gäi hµm, m¶ng sÏ ®îc khëi t¹o mét lÇn
VÝ dô1: T¹o mét m¶ng coffees víi 3 phÇn tö vµ ®é dµi cña m¶ng lµ 3:
coffees = [“French Roast”,”Columbian”,”Kona”]
VÝ dô 2: T¹o ra mét m¶ng víi 2 phÇn tö ®îc khëi ®Çu vµ mét phÇn tö rçng:
fish = [“Lion”, ,” Surgeon”]
Víi biÓu thøc nµy, fish[0] lµ “Lion”, fish[2] lµ ” Surgeon”, vµ fish[2] cha ®îc ®Þnh nghÜa
Sö dông mét hµm x©y dùng(Constructor Function)
B¹n cã thÓ t¹o ra ®èi tîng cña riªng m×nh víi hai bíc sau:
§Þnh nghÜa kiÓu cña ®èi tîng b»ng c¸ch viÕt mét hµm x©y dùng.
T¹o ra mét c¸ thÓ cña ®èi tîng ®ã b»ng to¸n tö new
§Ó ®Þnh nghÜa mét kiÓu ®èi tîng, ta ph¶i t¹o ra mét hµm ®Ó chØ ®Þnh râ tªn, c¸c thuéc tÝnh vµ c¸c c¸ch thøc cña kiÓu ®èi tîng ®ã. VÝ dô gi¶ sö b¹n muèn t¹o mét kiÓu ®èi tîng « t« víi tªn lµ car, cã c¸c thuéc tÝnh make, model, year vµ color, ®Ó thùc hiÖn viÖc nµy cã thÓ viÕt mét hµm nh sau:
function car(make, model, year ){
this.make = make
this.model = model
this.year = year
}
Chó ý viÖc sö dông to¸n tö this ®Ó g¸n gi¸ trÞ cho c¸c thuéc tÝnh cña ®èi tîng ph¶i th«ng qua c¸c tham sè cña hµm.
VÝ dô, b¹n cã thÓ t¹o mét ®èi tîng míi kiÓu car nh sau:
mycar = new car(“Eagle”,”Talon TSi”,1993)
C©u lÖnh nµy sÏ t¹o ra ®èi tîng mycar vµ liªn kÕt c¸c gi¸ trÞ ®îc ®a vµo víi c¸c thuéc tÝnh. Khi ®ã gi¸ trÞ cña mycar.make lµ “Eagle”, gi¸ trÞ cña mycar.model lµ “Talon TSi”, vµ mycar.year lµ mét sè nguyªn 1993....Cø nh vËy b¹n cã thÓ t¹o ra nhiÒu ®èi tîng kiÓu car.
Mét ®èi tîng còng cã thÓ cã nh÷ng thuéc tÝnh mµ b¶n th©n nã còng lµ mét ®èi tîng. VÝ dô b¹n ®Þnh nghÜa thªm mét ®èi tîng kh¸c lµ person nh sau:
function person(name, age, sex){
this.name=name
this.age=age
this.sex=sex
}
Vµ sau ®ã ta t¹o ra hai ngêi míi:
rank = new person(“Rank McKinnon”,33,”M”)
ken = new person(“Ken John”,39,”M”)
B©y giê b¹n ®Þnh nghÜa l¹i hµm x©y dùng car nh sau:
function car(make, model, year,owner ){
this.make = make
this.model = model
this.year = year
this.owner = owner
}
Nh vËy b¹n cã thÓ t¹o ®èi tîng kiÓu car míi:
car1 = new car(“Eagle”,”Talon TSi”,1993,rank)
car2 = new car(“Nissan”,”300ZX”,1992,ken)
Nh vËy, thay v× ph¶i qua mét x©u ký tù hay mét gi¸ trÞ sè khi t¹o ®èi tîng, ta chØ cÇn ®a hai ®èi tîng ®· ®îc t¹o ë c©u lÖnh trªn vµo dßng tham sè cña ®èi tîng míi t¹o. Ta còng cã thÓ lÊy ®îc thuéc tÝnh cña ®èi tîng owner b»ng c©u lªnh sau:
car2.owner.name
Chó ý r»ng b¹n còng cã thÓ t¹o ra mét thuéc tÝnh míi cho ®èi tîng tríc khi ®Þnh nghÜa nã, vÝ dô:
car1.color=”black”
Nh vËy, thuéc tÝnh color cña ®èi tîng car1 ®îc g¸n lµ “black”. Tuy nhiªn, nã sÏ kh«ng g©y t¸c ®éng tíi bÊt kú mét ®èi tîng kiÓu car nµo kh¸c. NÕu muèn thªm thuéc tÝnh cho tÊt c¶ c¸c ®èi tîng th× ph¶i ®Þnh nghÜa l¹i hµm x©y dùng ®èi tîng.
LËp môc lôc cho c¸c thuéc tÝnh cña ®èi tîng
Trong Navigator 2.0, b¹n cã thÓ gäi thuéc tÝnh cña mét ®èi tîng b»ng tªn thuéc tÝnh hoÆc b»ng sè thø tù cña nã. Tuy nhiªn tõ Navigator 3.0 trë ®i, nÕu ban ®Çu b¹n ®Þnh nghÜa mét thuéc tÝnh b»ng tªn cña nã, b¹n sÏ lu«n lu«n ph¶i gäi nã b»ng tªn, vµ nÕu b¹n ®Þnh nghÜa mét thuéc tÝnh b»ng chØ sè th× b¹n còng lu«n lu«n ph¶i gäi tíi nã b»ng chØ sè.
§iÒu nµy øng dông khi b¹n t¹o mét ®èi tîng víi nh÷ng thuéc tÝnh cña chóng b»ng hµm x©y dùng (nh vÝ dô vÒ kiÓu ®èi tîng car ë phÇn tríc) vµ khi b¹n ®Þnh nghÜa nh÷ng thuéc tÝnh cña riªng mét ®èi tîng (nh mycar.color=”red”). V× vËy nÕu b¹n ®Þnh nghÜa c¸c thuéc tÝnh cña ®èi tîng ngay tõ ®Çu b»ng chØ sè nh mycar[5]=”25 mpg”, b¹n cã thÓ lÇn lît gäi tíi c¸c thuéc tÝnh kh¸c nh mycar[5].
Tuy nhiªn ®iÒu nµy lµ kh«ng ®óng ®èi víi nh÷ng ®èi tîng t¬ng øng cña HTML nh m¶ng form. B¹n cã thÓ gäi tíi c¸c ®èi tîng trong m¶ng bëi sè thø tù hoÆc tªn cña chóng. VÝ dô thÎ thø hai trong mét document cã thuéc tÝnh NAME lµ “myform” th× b¹n cã thÓ gäi tíi form ®ã b»ng document.form[1] hoÆc document.form[“myForm”] hoÆc document.myForm
§Þnh nghÜa thªm c¸c thuéc tÝnh cho mét kiÓu ®èi tîng
B¹n cã thÓ thªm thuéc tÝnh cho mét kiÓu ®èi tîng ®· ®îc ®Þnh nghÜa tríc b»ng c¸ch sö dông thuéc tÝnh property. Thuéc tÝnh ®îc ®Þnh nghÜa nµy kh«ng chØ cã t¸c dông ®èi víi mét ®èi tîng mµ cã t¸c dông ®èi víi tÊt c¶ c¸c ®èi tîng kh¸c cïng kiÓu.VÝ dô sau thùc hiÖn thªm thuéc tÝnh color cho tÊt c¶ c¸c ®èi tîng kiÓu car, sau ®ã g¾n mét gi¸ trÞ mµu cho thuéc tÝnh color cña ®èi tîng car1:
car.prototype.color=null
car1.color=”red”
§Þnh nghÜa c¸c c¸ch thøc
Mét c¸ch thøc lµ mét hµm ®îc liªn kÕt víi mét ®èi tîng. B¹n ®Þnh nghÜa mét c¸ch thøc còng cã nghÜa lµ b¹n ®Þnh nghÜa mét hµm chuÈn. B¹n cã thÓ sö dông có ph¸p sau ®Ó g¾n mét hµm cho mét ®èi tîng ®ang tån t¹i:
object.methodname = function_name
Trong ®ã object lµ ®èi tîng ®ang tån t¹i, methodname lµ tªn c¸ch thøc vµ function_name lµ tªn hµm
B¹n cã thÓ gäi c¸ch thøc nµy tõ ®èi tîng nh sau:
object.methodname()
B¹n cã thÓ ®Þnh nghÜa c¸ch thøc cho mét kiÓu ®èi tîng b»ng c¸ch ®a c¸ch thøc ®ã vµo trong hµm x©y dùng ®èi tîng. VÝ dô b¹n cã thÓ ®Þnh nghÜa mét hµm cã thÓ ®Þnh d¹ng vµ hiÓn thÞ c¸c thuéc tÝnh cña c¸c ®èi tîng kiÓu car ®· x©y dùng ë phÇn tríc:
function displayCar () {
var result = “Abeautiful”+this.year+ “ ”+ this.make + “ ”+ this.model
document.write(result)
}
B¹n cã thÓ thªm c¸ch thøc nµy vµo cho ®èi tîng car b»ng c¸ch thªm dßng lÖnh sau vµo hµm ®Þnh nghÜa ®èi tîng
this.displayCar= displayCar;
Nh vËy cã thÓ ®Þnh nghÜa l¹i ®èi tîng car nh sau:
function car(make, model, year,owner ){
this.make = make
this.model = model
this.year = year
this.owner = owner
this.displayCar= displayCar
}
Sau ®ã, b¹n cã thÓ gäi c¸ch thøc displayCar ®èi víi mçi ®èi tîng:
car1.displayCar()
car2.displayCar()
Sö dông cho c¸c tham chiÕu ®èi tîng (Object References)
JavaScript cã mét tõ kho¸ ®Æc biÖt lµ this mµ b¹n cã thÓ sö dông nã cïng víi mét c¸ch thøc ®Ó gäi tíi ®èi tîng hiÖn thêi. VÝ dô, gi¶ sö b¹n cã mét hµm validate dïng ®Ó x¸c nhËn gi¸ trÞ thuéc tÝnh cña mét ®èi tîng n»m trong mét kho¶ng nµo ®ã:
function validate(obj, lowval, hival){
if ( (obj.valuehival) )
alert(“Invalid value!”)
}
Sau ®ã b¹n cã thÓ gäi hµm validate tõ mçi thÎ sù kiÖn onChange:
Khi liªn kÕt víi mét thuéc tÝnh form, tõ kho¸ this cã thÓ gäi tíi form cha cña ®èi tîng hiÖn thêi. Trong vÝ dô sau, myForm cã chøa ®èi tîng Text vµ mét nót bÊm. Khi ngêi sö dông kÝch vµo nót bÊm, trêng text sÏ hiÓn thÞ tªn form. ThÎ sù kiÖn onClick cña nót bÊm sö dông this.form ®Ó gäi tíi form cha lµ myForm.
Form name:
<INPUT TYPE=”button” NAME=”button1”
value=”Show Form Name” onClick=”this.form.text1.value=this.form.name”>
Xo¸ ®èi tîng
Trong JavaScript cho Navigator 2.0, b¹n kh«ng thÓ xo¸ c¸c ®èi tîng-chóng vÉn tån t¹i trong khi b¹n ®· rêi khái trang ®ã. Trong khi JavaScript cho Navigator 3.0 cho phÐp b¹n cã thÓ xo¸ mét ®èi tîng b»ng c¸ch ®Æt cho nã trá tíi gi¸ trÞ Null (nÕu nh ®ã lµ lÇn cuèi cïng gäi tíi ®èi tîng). JavaScript sÏ ®ãng ®èi tîng ®ã ngay lËp tøc th«ng qua biÓu thøc g¸n.
B¶ng tæng kÕt c¸c tõ kho¸
Sau ®©y lµ c¸c tõ ®ùoc ®Þnh nghÜa lµ mét phÇn trong ng«n ng÷ JavaScript vµ kh«ng ®îc sö dông lµ tªn biÕn:
abstract
eval
int
static
boolean
extends
interface
super
break
false
long
switch
byte
final
native
synchrinized
case
finally
new
this
catch
float
null
throw
char
for
package
throws
class
function
parseFloat
transient
const
goto
parseInt
true
continue
if
private
try
default
implements
protected
var
do
import
public
void
double
in
return
while
else
instanceof
short
with
Tæng kÕt
Nh vËy, tµi liÖu kh«ng nh÷ng ®· giíi thiªu s¬ qua vÒ JavaScript, mµ nã cßn lµ s¸ch tham kh¶o hÕt søc h÷u Ých ®Ó ph¸t triÓn øng dông cña b¹n.
B¹n cã thÓ tham kh¶o toµn diÖn JavaScript trong quyÓn Teach Yourself JavaScript in 14 Days, hoÆc JavaScript Guide
Do JavaScript lµ ng«n ng÷ cßn míi vµ cã sù thay ®æi nhanh chãng, b¹n nªn ®Õn víi trang Web cña h·ng Netscape ( ) ®Ó cã c¸c th«ng tin míi nhÊt vÒ ng«n ng÷ nµy.
Các file đính kèm theo tài liệu này:
- Giáo Trình JavaScipt.doc