Giao Trinh Javascript Hay

Trang 1/109
Gio trnh JavaScript ***

CH CH NG 1 L I NI U ........................................................................................................... 4 NG 2 NH P MN JAVASCRIPT ....................................................................................... 5 2.1.Nhng JavaScript vo file HTML .................................................................................. 5 2.3. Th <NOScript> v </NOSCRIPT> ............................................................................. 7 2.3. Hi n th m t dng text ................................................................................................. 8 2.4. Giao ti p v i ng i s d ng ..................................................................................... 10 2.5. i m l i cc l nh v m r ng .................................................................................... 13 NG 3 BI N TRONG JAVASCRIPT .................................................................................. 14 3.1. Bi n v phn lo I bi n............................................................................................... 14 3.2. Bi u di n t t trong JavaScript ................................................................................ 14 3.3. Ki u d li u .............................................................................................................. 14 1.1.1. KI u nguyn (Interger) ...................................................................................... 16 1.1.2. Ki u d u ph y ng (Floating Point) ................................................................. 16 1.1.3. Ki u logic (Boolean) ......................................................................................... 16 1.1.4. Ki u chu i (String) ............................................................................................ 16 XY D NG CC BI U TH C TRONG JAVASCRIPT ................................................. 17
CH
2.
NH NGH A V PHN LO I BI U TH C ................................................................................ 17 CC TON T (OPERATOR) ................................................................................................... 17 2.1.1. Gn .................................................................................................................. 17 2.1.2. So snh ............................................................................................................ 17 2.1.3. S h c .............................................................................................................. 18 2.1.4. Chu i ............................................................................................................... 18 2.1.5. Logic ................................................................................................................ 19 2.1.6. Bitwise.............................................................................................................. 19 BI T P .................................................................................................................................... 19 2.1.7. Cu h i............................................................................................................. 19 2.1.8. Tr l i............................................................................................................... 20 3. CC L NH ................................................................................................................... 21 CU L NH I U KI N.............................................................................................................. 21 CU L NH L P ........................................................................................................................ 21 3.1.1. Vng l p for ...................................................................................................... 22 3.1.2. while................................................................................................................. 23 3.1.3. Break ............................................................................................................... 23 3.1.4. continue ........................................................................................................... 23 CC CU L NH THAO TC TRN IT NG ...................................................................... 23 3.1.5. for...in ............................................................................................................... 24 3.1.6. new .................................................................................................................. 25 3.1.7. this ................................................................................................................... 26 3.1.8. with .................................................................................................................. 26
Trang 2/109
CC HM (FUNCTIONS) .......................................................................................................... 27 CC HM C S N ................................................................................................................... 27 3.1.9. eval .................................................................................................................. 28 3.1.10. parseInt ............................................................................................................ 29 3.1.11. parseFloat ........................................................................................................ 29 M NG (ARRAY) ........................................................................................................................ 30 S KI N ................................................................................................................................... 31 BI T P .................................................................................................................................... 34 3.1.12. Cu h i............................................................................................................. 34 3.1.13. Tr l i............................................................................................................... 35 4. IT IT CC IT NG TRONG JAVASCRIPT .................................................................... 37 NG NAVIGATOR ........................................................................................................ 38 NG WINDOW ............................................................................................................. 39 4.1.1. Cc thu c tnh .................................................................................................. 40 4.1.2. Cc Ph ng th c ............................................................................................. 40 4.1.3. Cc Ch ng trnh x l s ki n ........................................................................ 41 IT NG LOCATION ........................................................................................................... 41 IT NG FRAME ................................................................................................................ 41 4.1.4. Cc thu c tnh .................................................................................................. 41 4.1.5. Cc Ph ng th c ............................................................................................. 41 4.1.6. S d ng Frame ................................................................................................ 41 IT NG DOCUMENT ........................................................................................................ 45 4.1.7. Cc thu c tnh .................................................................................................. 45 4.1.8. Cc Ph ng th c ............................................................................................. 45 IT NG ANCHORS ........................................................................................................... 45 IT NG FORMS ................................................................................................................ 46 4.1.9. Cc thu c tnh .................................................................................................. 46 4.1.10. Cc Ph ng th c ............................................................................................. 46 4.1.11. Cc Ch ng trnh x l s ki n ........................................................................ 46 IT NG HISTORY ............................................................................................................. 46 4.1.12. Cc thu c tnh .................................................................................................. 46 4.1.13. Cc Ph ng th c ............................................................................................. 46 IT NG LINKS................................................................................................................... 47 4.1.14. Cc thu c tnh .................................................................................................. 47 4.1.15. Cc Ch ng trnh x l s ki n ........................................................................ 47 IT NG MATH................................................................................................................... 47 4.1.16. Cc thu c tnh .................................................................................................. 47 4.1.17. Cc Ph ng th c ............................................................................................. 47 IT NG DATE ................................................................................................................... 48 4.1.18. Cc Ph ng th c ............................................................................................. 48 IT NG STRING ............................................................................................................... 49 4.1.19. Cc Ph ng th c ............................................................................................. 49 CC PH N T C A IT NG FORM ................................................................................. 49 4.1.20. Thu c tnh type................................................................................................. 50
Trang 3/109
4.1.21. 4.1.22. 4.1.23. 4.1.24. 4.1.25. 4.1.26. 4.1.27. 4.1.28. 5. Ph Ph Ph Ph Ph Ph Ph Ph nt nt nt nt nt nt nt nt IT button.................................................................................................. 50 checkbox............................................................................................. 51 File Upload.......................................................................................... 52 hidden ................................................................................................. 52 Password ............................................................................................ 53 radio ................................................................................................... 53 reset ................................................................................................... 54 select .................................................................................................. 55 NG (OBJECT MODEL) .................................................................. 56
M HNH
IT NG V THU C TNH.................................................................................................. 56 T O CC IT NG M I ..................................................................................................... 56 5.1.1. S d ng kh i t o i T ng............................................................................. 56 5.1.2. S d ng m t hm xy d ng(Constructor Function) ........................................... 56 5.1.3. L p m c l c cho cc thu c tnh c a i t ng .................................................. 56 5.1.4. nh ngh a thm cc thu c tnh cho m t ki u i t ng .................................... 56 5.1.5. nh ngh a cc cch th c ................................................................................. 56 5.1.6. S d ng cho cc tham chi u i t ng (Object References) ............................ 56 5.1.7. Xo i t ng .................................................................................................. 56 6. 7. B NG T NG K T CC T KHO .............................................................................. 56 T NG K T ................................................................................................................... 56
Trang 4/109
CH
NG 1 L I NI
V i HTML and Microsoft FrontPage b n bi t cch t o ra trang Web - tuy nhin ch m i m c bi u di n thng tin ch cha ph i l cc trang Web ng c kh n ng p ng cc s ki n t pha ng i dng. Hng Netscape a ra ngn ng script c tn l LiveScript th c hi n ch c n ng ny. Sau ngn ng ny c i tn thnh JavaScript t n d ng tnh i chng c a ngn ng l p trnh Java. M c d c nh ng i m t ng ng gi a Java v JavaScript, nh ng chng v n l hai ngn ng ring bi t. JavaScript l ngn ng d i d ng script c th g n v i cc file HTML. N khng c bin d ch m c trnh duy t di n d ch. Khng gi ng Java ph i chuy n thnh cc m d bin d ch, trnh duy t c JavaScript d i d ng m ngu n. Chnh v v y b n c th d dng h c JavaScript qua v d b i v b n c th th y cch s d ng JavaScript trn cc trang Web. JavaScript l ngn ng d a trn i t ng, c ngh a l bao g m nhi u ki u i t ng, v d i t ng Math v i t t c cc ch c n ng ton h c. Tuy v y JavaScript khng l ngn ng h ng i t ng nh C++ hay Java do khng h tr cc l p hay tnh th a k . JavaScript c th p ng cc s ki n nh t i hay lo i b cc form. Kh n ng ny cho php JavaScript tr thnh m t ngn ng script ng. Gi ng v i HTML v Java, JavaScript c thi t k c l p v i h i u hnh. N c th ch y trn b t k h i u hnh no c trnh duy t h tr JavaScript. Ngoi ra JavaScript gi ng Java kha c nh an ninh: JavaScript khng th c v vi t vo file c a ng i dng. Cc trnh duy t web nh Nescape Navigator 2.0 tr i c th hi n th nh ng cu l nh JavaScript c nhng vo trang HTML. Khi trnh duy t yu c u m t trang, server s g i y n i dung c a trang , bao g m c HTML v cc cu l nh JavaScript qua m ng t i client. Client s c trang t u n cu i, hi n th cc k t qu c a HTML v x l cc cu l nh JavaScript khi no chng xu t hi n. Cc cu l nh JavaScript c nhng trong m t trang HTML c th tr l i cho cc s ki n c a ng i s d ng nh kch chu t, nh p vo m t form v i u h ng trang. V d b n c th ki m tra cc gi tr thng tin m ng i s d ng a vo m khng c n n b t c m t qu trnh truy n trn m ng no. Trang HTML v i JavaScript c nhng s ki m tra cc gi tr c a vo v s thng bo v i ng i s d ng khi gi tr a vo l khng h p l . M c ch c a ph n ny l gi i thi u v ngn ng l p trnh JavaScript b n c th vi t cc script vo file HTML c a mnh.
Trang 5/109
CH
NG 2 NH P MN JAVASCRIPT
2.1.NHNG JAVASCRIPT VO FILE HTML B n c th nhng JavaScript vo m t file HTML theo m t trong cc cch sau y: y S d ng cc cu l nh v cc hm trong c p th <SCRIPT> y S d ng cc file ngu n JavaScript y S d ng m t bi u th c JavaScript lm gi tr c a m t thu c tnh HTML y S d ng th s ki n (event handlers) trong m t th HTML no Trong , s d ng c p th <SCRIPT>...</SCRIPT> v nhng m t file ngu n JavaScript l c s d ng nhi u h n c . 2.1.1.S d ng th SCRIPT
Ch : Ghi ch khng c t trong c p th <- v -> nh ghi ch trong file HTML. C php c a JavaScript t ng t c php c a C nn c th s d ng // hay /* ... */.
Script c a vo file HTML b ng cch s d ng c p th <SCRIPT> v </SCRIPT>. Cc th <SCRIPT> c th xu t hi n trong ph n <HEAD> hay <BODY> c a file HTML. N u t trong ph n <HEAD>, n s c t i v s n sng tr c khi ph n cn l i c a v n b n c t i. Thu c tnh duy nh t c nh ngh a hi n th i cho th <SCRIPT> l LANGUAGE= dng xc nh ngn ng script c s d ng. C hai gi tr c nh ngh a l "JavaScript" v "VBScript". V i Ch ng trnh vi t b ng JavaScript b n s d ng c php sau :
<SCRIPT LANGUAGE=JavaScript> // INSERT ALL JavaScript HERE </SCRIPT>
i m khc nhau gi a c php vi t cc ghi ch gi a HTML v JavaScript l cho php b n n cc m JavaScript trong cc ghi ch c a file HTML, cc trnh duy t c khng h tr cho JavaScript c th c c n nh trong v d sau y:
<SCRIPT LANGUAGE=JavaScript>  </SCRIPT>
Dng cu i cng c a script c n c d u // trnh duy t khng di n d ch dng ny d i d ng m JavaScript. Cc v d trong Ch ng ny khng ch a c i m n c a JavaScript m c th d hi u h n. 2.1.2. S d ng m t file ngu n JavaScript
Trang 6/109 Thu c tnh SRC c a th <SCRIPT> cho php b n ch r file ngu n JavaScript cs d ng (dng Ph ng php ny hay h n nhng tr c ti p m t o n l nh JavaScript vo trang HTML). C php:
<SCRIPT SRC="file_name.js"> .... </SCRIPT>
Thu c tnh ny r y h u d ng cho vi c chia s cc hm dng chung cho nhi u trang khc nhau. Cc cu l nh JavaScript n m trong c p th <SCRIPT> v </SCRIPT> c ch a thu c tinh SRC tr khi n c l i. V d b n mu n a dng l nh sau vo gi a c p th <SCRIPT SRC="..."> v </SCRIPT>:
document.write("Khng tm th y file JS a vo!");
Thu c tnh SRC c th tuy t i, v d :
nh r b ng
a ch URL, cc lin k t ho c cc
ng d n
<SCRIPT SRC=" http://cse.com.vn ">

Ch Khi b n mu n ch ra m t xu trch d n trong m t xu khc c n s d ng d u nhy n ( ' ) phn nh xu . i u ny cho php script nh n ra xu k t .
Cc file JavaScript bn ngoi khng c ch a b t k th HTML no. Chng ch c ch a cc cu l nh JavaScript v nh ngh a hm. Tn file c a cc hm JavaScript bn ngoi c n c ui .js, v server s ph i nh x ui .js t i ki u MIME application/x-javascript. l nh ng g m server g i tr l i ph n Header c a file HTML. nh x ui ny vo ki u MIME, ta thm dng sau vo file mime.types trong ng d n c u hnh c a server, sau kh i ng
l i server: N u server khng nh x s t i file JavaScript c ch ra trong thu c tnh SRC v khng ng cch. Trong v d sau, hm bar c ch a xu "left" n m trong m t c p d u nhy kp:
function bar(widthPct){ document.write(" <HR ALIGN='LEFT' WIDTH="+widthPct+"%>") }
type=application/x-javascript c ui .js t i ki u MIME application/x-javascript , Navigator
2.3. TH
<NOSCRIPT> V </NOSCRIPT>
C p th ny dng nh r n i dung thng bo cho ng i s d ng bi t trnh duy t khng h tr JavaScript. Khi trnh duy t s khng hi u th <NOSCRIPT> v n b l i, cn o n m n m trong c p th ny s c Navigator hi n th . Ng c l i, n u trnh duy t c h tr JavaScript th o n m trong c p th <NOSCRIPT> s c b qua. Tuy nhin, i u ny c ng c th x y ra n u ng i s d ng khng s d ng JavaScript trong trnh duy t c a mnh b ng cch t t n i trong h p Preferences/Advanced.
Trang 7/109 V d :
<NOSCRIPT> <B> Trang ny c s d ng JavaScript. Do b n c n s d ng trnh duy t Netscape Navigator t version 2.0 tr i! <BR> <A HREF="http://home.netscape.com/comprd/mirror/index.html"> Hy kch chu t vo y t i v phin b n Netscape m i h n </A> </BR> N u b n s d ng trnh duy t Netscape t 2.0 tr i m v n c c dng ch ny th hy b t Preferences/Advanced/JavaScript ln </NOSCRIPT>
Hnh 2.3: Minh ho th NOSCRIPT 2.3. HI N TH M T DNG TEXT
Trong h u h t cc ngn ng l p trnh, m t trong nh ng kh n ng c s l hi n th ra mn hnh m t dng text. Trong JavaScript, ng i l p trnh c ng c th i u khi n vi c xu t ra mn hnh c a client m t dng text tu n t trong file HTML. JavaScript s xc nh i m m n s xu t ra trong file HTML v dng text k t qu s c d ch nh cc dng HTML khc v hi n th trn trang. H n n a, JavaScript cn cho php ng i l p trnh sinh ra m t h p thng bo ho c xc nh n g m m t ho c hai nt. Ngoi ra, dng text v cc con s cn c th hi n th trong tr ng TEXT v TEXTAREA c a m t form. Trong ph n ny, ta s h c cch th c write() v writeln() c a i t ng document.
Trang 8/109 i t ng document trong JavaScript c thi t k s n hai cch th c xu t m t dng text ra mn hnh client: write() v writeln(). Cch g i m t cch th c c a m t i t ng nh sau:
object_name.property_name
D li u m cch th c dng d :
th c hi n cng vi c c a n
document.write("Test"); document.writeln('Test');
c a vo dng tham s , v
Cch th c write() xu t ra mn hnh xu Text nh ng khng xu ng dng, cn cch th c writeln() sau khi vi t xong dng Text t ng xu ng dng. Hai cch th c ny u cho php xu t ra th HTML.
V d : Cch th c write() xu t ra th HTML

<HTML> <HEAD> <TITLE>Ouputting Text</TITLE> </HEAD> <BODY> This text is plain.<BR> <B> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </BODY> </HTML>
Trang 9/109
V d : S khc nhau c a write() v writeln():

<PRE> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </PRE>
Khi duy t s
c k t qu :
Trang 10/109
Hnh 2.5: S khc nhau c a write() v writeln() 2.4. GIAO TI P V I NG I S D NG
JavaScript h tr kh n ng cho php ng i l p trnh t o ra m t h p h i tho i. N i dung c a h p h i tho i ph thu c vo trang HTML c ch a o n script m khng lm nh hng n vi c xu t n i dung trang. Cch n gi n lm vi c l s d ng cch th c alert(). s d ng c cch th c ny, b n ph i a vo m t dng text nh khi s d ng document.write() v document.writeln() trong ph n tr c. V d : alert("Nh n vo OK ti p t c"); Khi file s ch cho n khi ng i s d ng nh n vo nt OK r i m i ti p t c th c hi n Thng th ng, cch th c alert() c s d ng trong cc tr ng h p: y Thng tin a v form khng h p l y K t qu sau khi tnh ton khng h p l y Khi d ch v cha s n sng truy nh p d li u
Trang 11/109
Tuy nhin cch th c alert() m i ch cho php thng bo v i ng i s d ng ch ch a th c s giao ti p v i ng i s d ng. JavaScript cung c p m t cch th c khc giao ti p v i ng i s d ng l promt(). T ng t nh alert(), prompt() t o ra m t h p h i tho i v i m t dng thng bo do b n a vo, nh ng ngoi ra n cn cung c p m t tr ng nh p d li u vo. Ng i s d ng c th nh p vo tr ng r i kch vo OK. Khi , ta c th x l d li u do ng i s d ng v a a vo. V d : H p h i tho i g m m t dng thng bo, m t tr ng nh p d li u, m t nt OK v m t nt Cancel Ch ng trnh ny s h i tn ng i dng v sau s hi n th m t thng bo ng n s d ng tn m i a vo. V d c l u vo file Hello.html
<HTML> <HEAD> <TITLE> JavaScript Exemple </TITLE> <SCRIPT LANGUAGE= JavaScript> var name=window.prompt(Hello! Whats your name ?,); document.write(Hello + name + ! I hope you like JavaScript ); </SCRIPT> </HEAD> <BODY> </BODY> </HTML>
Trang 12/109
Hnh2.1: Hi n th c a s nh p tn Khi duy t c k t qu : V d ny hi n th d u nh c nh p vo tn v i Ph ng th c window.prompt. Gi tr t cs c ghi trong bi n c tn l name. Bi n name c k t h p v i cc chu i khc v c hi n th trong c a s c a trnh duy t nh Ph ng th c document.write.
Hnh 2.2: Hi n th l i cho ng
i nh p
Trang 13/109 By gi b n c t ng v cc ch c n ng c th ti p t c tm hi u thm v chnh ngn ng ny. 2.5. I M L I CC L NH V M

R NG KI U th HTML Thu c tnh c a th SCRIPT thu c tnh c a th SCRIPT Ghi ch trong JavaScript Ghi ch trong JavaScript cch th c JavaScript Cch th c JavaScript Cch th c c a JavaScript Cch th c JavaScript
c qua JavaScript, chng ta hy
R NG
M T H p ch a cc l nh JavaScript Gi a ch c a file JavaScript bn ngoi. File ny ph i c ph n ui .js nh r ngn ng script c s d ng (JavaScript ho c VBScript) nh d u ghi ch m t dng trong o n script nh d u ghi ch m t kh i trong o n script Xu t ra m t xu trn c a s hi n th i m t cch tu n t theo file HTML c o n script T ng t cch th c document.write() nh ng vi t xong t xu ng dng. Hi n th m t dng thng bo trn h p h i tho i
L NH/M SCRIPT SRC
LANGUAGE
// /*...*/ document.write() document.writeln() alert()
promt()
Hi n th m t dng thng bo trong h p h i tho i ng th i cung c p m t tr ng nh p d li u ng i s d ng nh p vo.
Trang 14/109
CH
NG 3 BI N TRONG JAVASCRIPT
3.1. BI N V PHN LO I BI N Tn bi n trong JavaScript ph i b t u b ng ch hay d u g ch d i. Cc ch s khng c s d ng m u tn m t bi n nh ng c th s d ng sau k t u tin. Ph m vi c a bi n c th l m t trong hai ki u sau: y Bi n ton c c: C th c truy c p t b t k u trong ng d ng. c khai bo nh sau :
x = 0;
y Bi n c c b : Ch bo. Bi n c c b c truy c p trong ph m vi Ch ng trnh m n khai c khai bo trong m t hm v i t kho var nh sau:
var x = 0;
Bi n ton c c c th s d ng t kho var, tuy nhin i u ny khng th c s c n thi t. 3.2. BI U DI N T
Ch Khc v i C, trong JavaScript khng c ki u h ng s CONST bi u di n m t gi tr khng i no y
TRONG JAVASCRIPT ng trnh khng thay i. Sau y
T t l cc gi tr trong Ch l cc v d v t t :
8 The dog ate my shoe true
3.3. KI U D
LI U
Khc v i C++ hay Java, JavaScript l ngn ng c tnh nh ki u th p. i u ny c ngh a l khng ph i ch ra ki u d li u khi khai bo bi n. Ki u d li u ct ng chuy n thnh ki u ph h p khi c n thi t. V d file Variable.Html:
<HTML> <HEAD> <TITLE> Datatype Example </TITLE> <SCRIPT LANGUAGE= "JavaScript"> var fruit='apples'; var numfruit=12; numfruit = numfruit + 20; var temp ="There are " + numfruit + " " + "."; document.write(temp); </SCRIPT> </HEAD> <BODY> </BODY>
</HTML> Cc trnh duy t h tr JavaScript s x l chnh xc v d trn v y: a ra k t qu d i
Trang 15/109
Hnh 3.1: K t qu c a x l d li u Trnh di n d ch JavaScript s xem bi n numfruit c ki u nguyn khi c ng v i 20 v c ki u chu i khi k t h p v i bi n temp. Trong JavaScript, c b n ki u d li u sau y: ki u s nguyn, ki u d u ph y ng, ki u logic v ki u chu i. 1.1.1. KI U NGUYN (INTERGER) S nguyn c th c bi u di n theo ba cch: y H c s 10 (h th p phn) - c th bi u di n s nguyn theo c s 10, ch r ng ch s u tin ph i khc 0. y H c s 8 (h bt phn) - s nguyn c th bi u di n d i d ng bt phn v i ch s u tin l s 0. y H c s 16 (h th p l c phn) - s nguyn c th bi u di n d i d ng th p l c phn v i hai ch s u tin l 0x. 1.1.2. KI U D U PH Y NG (FLOATING POINT)
M t literal c ki u d u ph y ng c 4 thnh ph n sau: y Ph n nguyn th p phn. y D u ch m th p phn (.). y Ph n d . y Ph n m .
Trang 16/109 phn bi t ki u d u ph y d u ch m hay E. V d :

9.87 -0.85E4 9.87E14 .98E-3
ng v i ki u s nguyn, ph i c t nh t m t ch s theo sau
1.1.3. KI U LOGIC (BOOLEAN) Ki u logic c s d ng ch c hai gi tr y true. y false. ch hai i u ki n : ng ho c sai. Mi n gi tr c a ki u ny
1.1.4. KI U CHU I (STRING) M t literal ki u chu i ... " hay '... '. V d :
The dog ran up the tree The dog barked 100
c bi u di n b i khng hay nhi u k t
t trong c p d u "
bi u di n d u nhy kp ( " ), trong chu i s d ng ( \" ), v d :

document.write( \This text inside quotes.\ );
Trang 17/109
2. XY D NG JAVASCRIPT
CC
BI U
TH C
TRONG
NH NGH A V PHN LO I BI U TH C
T p h p cc literal, bi n v cc ton t nh m nh gi m t gi tr no c g i l m t bi u th c (expression). V c b n c ba ki u bi u th c trong JavaScript: y S h c: Nh m l ng gi gi tr s . V d (3+4)+(84.5/3) c nh gi b ng 197.1666666667. y Chu i: Nh m nh gi chu i. V d "The dog barked" + barktone + "!" l The dog barked ferociously!. y Logic: Nh m nh gi gi tr logic. V d temp>32 c th nh n gi tr sai. JavaScript c ng h tr bi u th c i u ki n, c php nh sau:
(condition) ? valTrue : valFalse
N u i u ki n condition c nh gi l ng, bi u th c nh n gi tr valTrue, ng c l i nh n gi tr valFalse. V d :

state = (temp>32) ? "liquid" : "solid"
Trong v d ny bi n state c gn gi tr "liquid" n u gi tr c a bi n temp l n h n 32; trong tr ng h p ng c l i n nh n gi tr "solid".
CC TON T
(OPERATOR)
Ton t c s d ng th c hi n m t php ton no trn d li u. M t ton t c th tr l i m t gi tr ki u s , ki u chu i hay ki u logic. Cc ton t trong JavaScript c th c nhm thnh cc lo i sau y: gn, so snh, s h c, chu i, logic v logic bitwise. 2.1.1. GN Ton t gn l d u b ng (=) nh m th c hi n vi c gn gi tr c a ton h ng bn ph i cho ton h ng bn tri. Bn c nh JavaScript cn h tr m t s ki u ton t gn rt g n. Ki u gn thng th ng x=x+y x=x-y x=x*y x=x/y x=x%y 2.1.2. SO SNH Ng i ta s d ng ton t so snh so snh hai ton h ng v tr l i gi tr ng hay sai ph thu c vo k t qu so snh. Sau y l m t s ton t so snh trong JavaScript: Ki u gn rt g n x+=y x-=y x*=y x/=y x%=y
Trang 18/109
== != > >= < <= 2.1.3. S
Tr l i gi tr Tr l i gi tr Tr l i gi tr
ng n u ton h ng bn tri b ng ton h ng bn ph i ng n u ton h ng bn tri khc ton h ng bn ph i ng n u ton h ng bn tri l n h n ton h ng bn ph i
Tr l i gi tr ng n u ton h ng bn tri l n h n ho c b ng ton h ng bn ph i Tr l i gi tr ph i ng n u ton h ng bn tri nh h n ton h ng bn
Tr l i gi tr ng n u ton h ng bn tri nh h n ho c b ng ton h ng bn ph i H C ng, JavaScript cn h
Bn c nh cc ton t c ng (+), tr (-), nhn (*), chia (/) thng th tr cc ton t sau y: var1% var2 var++ var--
Ton t ph n d , tr l i ph n d khi chia var1 cho var2 Ton t ph nh, c gi tr ph nh ton h ng Ton t ny t ng var ln 1 (c th bi u di n l ++var) Ton t ny gi m var i 1 (c th bi u di n l --var)
2.1.4. C HCh UN u b n gn gi tr c a ton t ++ hay -- vo m t bi n, nh y= x++, c th c cc k t qu khc nhau ph thu c vo v tr xu t hi n tr c hay sau c a ++ hay -- v i tn Ibi n (l x trong tr ng h p ny). N u ++ ng tr c x, x s c t ng ho c gi m tr c khi gi tr x c gn cho y. N u ++ hay -- ng sau x, gi tr c a x c gn Khi cho y tr c khi n c t ng hay gi m. c s d ng v i chu i, ton t + c coi l k t h p hai chu i, v d : "abc" + "xyz" c "abcxyz" 2.1.5. LOGIC JavaScript h tr cc ton t logic sau y:
expr1 && expr2
L ton t logic AND, tr l i gi tr expr1 v expr2 cng ng.
ng n u c
Trang 19/109
expr1 || expr2 ! expr
L ton t logic OR, tr l i gi tr ng n u t nh t m t trong hai expr1 v expr2 ng. L ton t logic NOT ph nh gi tr c a expr.
2.1.6. BITWISE V i cc ton t thao tc trn bit, u tin gi tr c chuy n d i d ng s nguyn 32 bit, sau l n l t th c hi n cc php ton trn t ng bit. & Ton t bitwise AND, tr l i gi tr 1 n u c hai bit cng l 1. | Ton t bitwise OR, tr l i gi tr 1 n u m t trong hai bit l 1. ^ Ton t bitwise XOR, tr l i gi tr 1 n u hai bit c gi tr khc nhau Ngoi ra cn c m t s ton t d ch chuy n bitwise. Gi tr c chuy n thnh s nguyn 32 bit tr c khi d ch chuy n. Sau khi d ch chuy n, gi tr l i c chuy n thnh ki u c a ton h ng bn tri. Sau y l cc ton t d ch chuy n: << Ton t d ch tri. D ch chuy n ton h ng tri sang tri m t s l ng bit b ng ton h ng ph i. Cc bit b chuy n sang tri b m t v 0 thay vo pha bn ph i. V d : 4<<2 tr thnh 16 (s nh phn 100 tr thnh s nh phn 10000) >> Ton t d ch ph i. D ch chuy n ton h ng tri sang ph i m t s l ng bit b ng ton h ng ph i. Cc bit b chuy n sang ph i b m t v d u c a ton h ng bn tri c gi nguyn. V d : 16>>2 tr thnh 4 (s nh phn 10000 tr thnh s nh phn 100) >>> Ton t d ch ph i c chn 0. D ch chuy n ton h ng tri sang ph i m t s l ng bit b ng ton h ng ph i. Bit d u c d ch chuy n t tri (gi ng >>). Nh ng bit c d ch sang ph i b xo i. V d : -8>>>2 tr thnh 1073741822 (b i cc bit d u tr thnh m t ph n c a s ). T t nhin v i s d ng k t qu c a ton t >> v >>> l gi ng nhau.
C m t s ton t d ch chuy n bitwise rt g n: Ki u bitwise thng th ng x = x << y x = x >> y x = x >>> y x=x&y x=x^y x=x|y Ki u bitwise rt g n x << = y x - >> y x >>> = y x&=y x^=y x|=y
Trang 20/109
BI T P
2.1.7. CU H I Hy nh gi cc bi u th c sau: 1. a. 7 + 5 b. "7" + "5" c. 7 == 7 d. 7 >= 5 e. 7 <= 7 2. f. (7 < 5) ? 7 : 5 g. (7 >= 5) && (5 > 5) h. (7 >= 5) || (5 > 5) 2.1.8. TR Cc bi u th c 1. a. 12 b. "75" c. true d. true e. true 2. f. 5 g. false h. true L I c nh gi nh sau:
Trang 21/109
3.
CC L NH
nh c a JavaScript thnh ba nhm sau: nh i u ki n. nh l p. nh tho tc trn i t ng.
C th chia cc l L L L
CU L NH
I U KI N
y
Cu l nh i u ki n cho php Ch ng trnh ra quy t nh v th c hi n cng vi c no d a trn k t qu c a quy t nh. Trong JavaScript, cu l nh i u ki n l if...else
if ... else
Cu l nh ny cho php b n ki m tra i u ki n v th c hi n m t nhm l nh no y d a trn k t qu c a i u ki n v a ki m tra. Nhm l nh sau else khng b t bu c ph i c, n cho php ch ra nhm l nh ph i th c hi n n u i u ki n l sai. C php
if ( < i u ki n> ) { //Cc cu l nh v i i u ki n ng } else { //Cc cu l nh v i i u ki n sai }
V d :
if (x==10){ document.write(x b ng 10, x = 0; } else document.write(x khng b ng 10.); t l i x b ng 0.);
Ch K t { v }
c s d ng
tch cc kh i m.
CU L NH L P
Cu l nh l p th hi n vi c l p i l p l i m t o n m cho n khi bi u th c i u ki n c nh gi l ng. JavaScipt cung c p hai ki u cu l nh l p:
Trang 22/109 y y for loop while loop
3.1.1. VNG L P FOR Vng l p for thi t l p m t bi u th c kh i u - initExpr, sau l p m t o n m cho n khi bi u th c < i u ki n> c nh gi l ng. Sau khi k t thc m i vng l p, bi u th c incrExpr c nh gi l i. C php: for (initExpr; < i u ki n> ; incrExpr){ //Cc l nh c th c hi n trong khi l p } V d :
<HTML> <HEAD> <TITLE>For loop Example </TITLE> <SCRIPT LANGUAGE= "JavaScript"> for (x=1; x<=10 ; x++) { y=x*25; document.write("x ="+ x +";y= "+ y + "<BR>"); } </SCRIPT> </HEAD> <BODY></BODY> </HTML>
Trang 23/109 Hnh 5.1: K t qu c a l nh for...loop
V d ny lu vo file for_loop.Html. Vng l p ny s th c hi n kh i m l nh cho 3.1.2. WHILE
n khi x>10.
Vng l p while l p kh i l nh ch ng no < i u ki n> cn C php: while (< i u ki n>) { //Cc cu l nh th c hi n trong khi l p } V d :
x=1; while (x<=10){ y=x*25; document.write("x="+x +"; y = "+ y + "<BR>"); x++; }
c nh gi l ng
K t qu c a v d ny gi ng nh v d tr 3.1.3. BREAK
c.
Cu l nh break dng k t thc vi c th c hi n c a vng l p for hay while. Ch c ti p t c th c hi n t i cu l nh ngay sau ch k t thc c a vng l p. C php
break;
ng trnh
o n m sau l p cho n khi x l n h n ho c b ng 100. Tuy nhin n u gi tr x a vo vng l p nh h n 50, vng l p s k t thc V d :
Trang 24/109
while (x<100) { if (x<50) break; x++; }
3.1.4. CONTINUE L nh continue gi ng l nh break nh ng khc ch vi c l p c k t thc v b t u t u vng l p. i v i vng l p while, l nh continue i u khi n quay l i < i u ki n>; v i for, l nh continue i u khi n quay l i incrExpr. C php
continue;
V d : o n m sau t ng x t 0 ln 5, nh y ln 8 v ti p t c t ng ln 10
x=0; while (x<=10) { document.write(Gi tr c a x l:+ x+<BR>); if (x=5) { x=8; continue; } x++; }
CC CU L NH THAO TC TRN
JavaScript l m t ngn ng d a trn cc i t ng. 3.1.5. FOR...IN it
IT
NG
ng, do n c m t s cu l nh lm vi c v i
Cu l nh ny c s d ng l p t t c cc thu c tnh (properties) c a m t i t ng. Tn bi n c th l m t gi tr b t k , ch c n thi t khi b n s d ng cc thu c tnh trong vng l p. V d sau s minh ho i u ny C php
for (<variable> in <object>) { //Cc cu l nh }
V d V d sau s l y ra t t c cc thu c tnh c a tnh. K t qu c minh ho trn hnh 5.2.
it
ng Window v in ra tn c a m i thu c
Trang 25/109
<HTML> <HEAD> <TITLE>For in Example </TITLE> <SCRIPT LANGUAGE= "JavaScript"> document.write("The properties of the Window object are: <BR>"); for (var x in window) document.write(" "+ x + ", "); </SCRIPT> </HEAD> <BODY> </BODY> </HTML>
Hnh 5.2: K t qu c a l nh for...in
Trang 26/109 3.1.6. NEW Bi n new c th c hi n C php t o ra m t th hi n m i c a m t it ng
objectvar = new object_type ( param1 [,param2]... [,paramN])
V d sau t o i t ng person c cc thu c tnh firstname, lastname, age, sex. Ch r ng t kho this c s d ng ch i t ng trong hm person. Sau ba th hi n c a i t ng person c t o ra b ng l nh new
<HTML> <HEAD> <TITLE>New Example </TITLE> <SCRIPT LANGUAGE= "JavaScript"> function person(first_name, last_name, age, sex){ this.first_name=first_name; this.last_name=last_name; this.age=age; this.sex=sex; } person1= new person("Thuy", "Dau Bich", "23", "Female"); person2= new person("Chung", "Nguyen Bao", "24", "Male"); person3= new person("Binh", "Nguyen Nhat", "24", "Male"); person4= new person("Hon", " V n", "24", "Male"); document.write ("1. "+person1.last_name+" " + person1.first_name + "<BR>" ); document.write("2. "+person2.last_name +" "+ person2.first_name + "<BR>"); document.write("3. "+ person3.last_name +" "+ person3.first_name + "<BR>"); document.write("4. "+ person4.last_name +" "+ person4.first_name+"<BR>"); </SCRIPT> </HEAD> <BODY> </BODY>
Trang 27/109
Hnh 5.3: K t qu c a v d l nh New

</HTML>
3.1.7. THIS T kho this c s d ng ch i t ng hi n th i. t ng hi n th i trong Ph ng th c ho c trong hm. C php

this [.property]
it
ng
c g i th ng l
C th xem v d c a l nh new. 3.1.8. WITH L nh ny c s d ng thi t l p i t ng ng m nh cho m t nhm cc l nh, b n c th s d ng cc thu c tnh m khng c p n i t ng. C php
with (object) { // statement }
V d : V d sau ch ra cch s d ng l nh with thi t l p i t ng ng m nh l document v c th s d ng Ph ng th c write m khng c n c p n i t ng document
Trang 28/109
<HTML> <HEAD> <TITLE>With Example </TITLE> <SCRIPT LANGUAGE= "JavaScript"> with (document){ write(This is an exemple of the things that can be done <BR>); write(With the <B>with<B> statment. <P>); write(This can really save some typing); } </SCRIPT> </HEAD> <BODY> </BODY>
Hnh 5.4: K t qu c a v d l nh with

</HTML>
CC HM (FUNCTIONS)
JavaScript c g cho php s d ng cc hm. M c d khng nh t thi t ph i c, song cc hm c th c m t hay nhi u tham s truy n vo v m t gi tr tr v . B i v JavaScript l ngn ng c tnh nh ki u th p nn khng c n nh ngh a ki u tham s v gi tr tr v
Trang 29/109 c a hm. Hm c th l thu c tnh c a m t i t ng, trong tr nh l Ph ng th c c a i t ng . L nh function c s d ng t o ra hm trong JavaScript. C php
function fnName([param1],[param2],...,[paramN]) { //function statement }
ng h p ny n
c xem
V d : V d sau minh ho cch th c t o ra v s d ng hm nh l thnh vin c a m t Hm printStats c t o ra l Ph ng th c c a i t ng person

<HTML> <HEAD> <TITLE>Function Example </TITLE> <SCRIPT LANGUAGE= "JavaScript"> function person(first_name, last_name, age, sex) { this.first_name=first_name; this.last_name=last_name; this.age=age; this.sex=sex; this.printStats=printStats; } function printStats() { with (document) { write (" Name :" + this.last_name + " " + this.first_name + "<BR>" ); write("Age :"+this.age+"<BR>"); write("Sex :"+this.sex+"<BR>"); } } person1= new person("Thuy", "Dau Bich", "23", "Female"); person2= new person("Chung", "Nguyen Bao", "24", "Male"); person3= new person("Binh", "Nguyen Nhat", "24", "Male"); person4= new person("Hoan", "Do Van", "23", "Male"); person1.printStats(); person2.printStats(); person3.printStats(); person4.printStats(); </SCRIPT> </HEAD> <BODY> </BODY> </HTML>
it
ng.
Trang 30/109
Hnh 8: V d v hm
Hnh 5.5: K t qu vi c s d ng hm
CC HM C S N
JavaScript c m t s hm c s n, g n tr c ti p vo chnh ngn ng v khng n m trong m t i t ng no: eval parseInt parseFloat 3.1.9. EVAL Hm ny c s d ng nh gi cc bi u th c hay l nh. Bi u th c, l nh hay cc i t ng c a thu c tnh u c th c nh gi. c bi t h t s c h u ch khi nh gi cc bi u th c do ng i dng a vo (ng c l i c th nh gi tr c ti p). C php: returnval=eval (b t k bi u th c hay l nh h p l trong Java) V d :
<HTML>
Trang 31/109
<HEAD> <TITLE>Eval Example </TITLE> <SCRIPT LANGUAGE= "JavaScript"> var string=10+ Math.sqrt(64); document.write(string+ =+ eval(string)); </SCRIPT> </HEAD> <BODY> </BODY> </HTML>
Hnh 5.6 V d hm Eval
3.1.10. PARSEINT Hm ny chuy n m t chu i s thnh s nguyn v i c s l tham s th hai (tham s ny khng b t bu c). Hm ny th ng c s d ng chuy n cc s nguyn sang c s 10 v m b o r ng cc d li u c nh p d i d ng k t c chuy n thnh s tr c khi tnh ton. Trong tr ng h p d li u vo khng h p l , hm parseInt s c v chuy n d ng chu i n v tr n tm th y k t khng ph i l s . Ngoi ra hm ny cn c t d u ph y ng. C php
parseInt (string, [, radix])
Trang 32/109 V d :
<HTML> <HEAD> <TITLE> perseInt Exemple </TITLE> <SCRIPT LANGUAGE= "JavaScript"> document.write("Converting 0xC hex to base-10: " + parseInt(0xC,10) + "<BR>"); document.write("Converting 1100 binary to base-10: " + parseInt(1100,2) + "<BR>"); </SCRIPT> </HEAD> <BODY> </BODY> </HTML>
Hnh 5.7: V d parInt 3.1.11. PARSEFLOAT Hm ny gi ng hm parseInt nh ng n chuy n chu i thnh s bi u di n d ph y ng. C php
parseFloat (string)
i d ng d u
V d :
Trang 33/109 V d sau minh ho cch th c x l c a parseFloat v i cc ki u chu i khc nhau. Hnh 5.8 minh h a k t qu
<HTML> <HEAD> <TITLE> perseFload Exemple </TITLE> <SCRIPT LANGUAGE= "JavaScript"> document.write("This script will show how diffrent strings are "); document.write("Converted using parseFloat<BR>"); document.write("137= " + parseFloat("137") + "<BR>"); document.write("137abc= " + parseFloat("137abc") + "<BR>"); document.write("abc137= " + parseFloat("abc137") + "<BR>"); document.write("1abc37= " + parseFloat("1abc37") + "<BR>"); </SCRIPT> </HEAD> <BODY> </BODY>
</HTML>
M NG (ARRAY)
M c d JavaScript khng h tr c u trc d li u m ng nh ng Netscape t o ra Ph th c cho php b n t t o ra cc hm kh i t o m ng nh sau:
function InitArray(NumElements){ this.length = numElements; for (var x=1; x<=numElements; x++){ this[x]=0
ng
Trang 34/109
} return this; }
N t o ra m t m ng v i kch th c xc nh tr c v i n cc gi tr 0. Ch r ng thnh ph n u tin trong m ng l di m ng v khng c s d ng. t o ra m t m ng, khai bo nh sau:

myArray = new InitArray (10)
N t o ra cc thnh ph n t myArray[1] n myArray[10] v i gi tr l 0. Gi tr cc thnh ph n trong m ng c th c thay i nh sau:

myArray[1] = "Ngh An" myArray[2] = "Lo"
Sau y l v d
<HTML> <HEAD> <TITLE> Array Exemple </TITLE> <SCRIPT LANGUAGE= "JavaScript"> function InitArray(numElements) { this.length = numElements; for (var x=1; x<=numElements; x++){ this[x]=0 } return this; } myArray = new InitArray(10); myArray[1] = "Ngh An"; myArray[2] = "H N i"; document.write(myArray[1] + "<BR>"); document.write(myArray[2] + "<BR>"); </SCRIPT> </HEAD> <BODY> </BODY> </HTML>
Trang 35/109
Hnh 5.9: V d m ng
KI N
JavaScript l ngn ng nh h ng s ki n, ngh a l s ph n ng tr c cc s ki n xc nh tr c nh kch chu t hay t i m t v n b n. M t s ki n c th gy ra vi c th c hi n m t o n m l nh (g i l cc Ch ng trinh x l s ki n) gip cho Ch ng trnh c th ph n ng m t cch thch h p.
Ch
t o n m hay m t hm c th c hi n ph n ng tr c m t s ki n g i l Ch ng trnh x l s ki n. Ch ng trnh x l s ki n c xc nh l m t thu c tnh c a m t th HTML:

<tagName eventHandler = "JavaScript Code or Function">
ng trnh x l s ki n (Event handler): M
V d sau g i hm CheckAge() m i khi gi tr c a tr
ng v n b n thay
i:
<INPUT TYPE=TEXT NAME="AGE" onChange="CheckAge()">
o n m c a Ch ng trnh x l s ki n khng l m t hm; n l cc l nh c a JavaScript cch nhau b ng d u ch m ph y. Tuy nhin cho m c ch vi t thnh cc module nn vi t d i d ng cc hm. M t s Ch ng trnh x l s ki n trong JavaScript:
onBlur onClick
X y ra khi input focus b xo t thnh ph n form X y ra khi ng i dng kch vo cc thnh ph n hay lin
Trang 36/109 k t c a form.

onChange onFocus onLoad onMouseOver onSelect onSubmit onUnLoad
X y ra khi gi tr c a thnh ph n X y ra khi thnh ph n c a form X y ra trang Web c t i.
c ch n thay
c focus(lm n i ln).
X y ra khi di chuy n chu t qua k t n i hay anchor. X y ra khi ng li u trn form. X y ra khi ng X y ra khi ng i s d ng l a ch n m t tr i dng a ra m t form. i dng ng m t trang it ng. Cc i ng nh p d
Sau y l b ng cc Ch ng trnh x l s ki n c s n c a m t s t ng ny s c trnh by k h n trong ph n sau. it Text Textarea Button Checkbox Radio button Hypertext link Clickable Imagemap area Reset button Submit button Document Window Framesets Form Image ng Ch Selection list onBlur, onChange, onFocus
ng trnh x l s ki n c s n
onBlur, onChange, onFocus, onSelect onBlur, onChange, onFocus, onSelect onClick onClick onClick onClick, onMouseOver, onMouseOut onMouseOver, onMouseOut onClick onClick onLoad, onUnload, onError onLoad, onUnload, onBlur, onFocus onBlur, onFocus onSubmit, onReset onLoad, onError, onAbort
V d sau l m t o n m script n gi n c a Ch ng trnh x l s ki n th m nh gi tr a vo trong tr ng text. Tu i c a ng i s d ng c nh p vo trong tr ng ny v Ch ng trnh x l s ki n s th m nh tnh h p l c a d li u a vo. N u khng h p l
Trang 37/109 s xu t hi n m t thng bo yu c u nh p l i. Ch ng trnh x l s ki n cg im i khi tr ng AGE b thay i v focus chuy n sang tr ng khc. Hnh 5.10 minh ho k t qu c a v d ny
<HTML> <HEAD> <TITLE> An Event Handler Exemple </TITLE> <SCRIPT LANGUAGE= "JavaScript"> function CheckAge(form) { if ( (form.AGE.value<0)||(form.AGE.value>120) ) { alert("Tu i nh p vo khng h p l ! M i b n nh p l i"); form.AGE.value=0; } } </SCRIPT> </HEAD> <BODY> <FORM NAME="PHIEU_DIEU_TRA">
Nh p vo tn c a b n:<BR>
Tn <INPUT TYPE=TEXT NAME="TEN" MAXLENGTH=10 SIZE=10><BR> m <INPUT TYPE=TEXT NAME="DEM" MAXLENGTH=15 SIZE=10><BR> H <INPUT TYPE=TEXT NAME="HO" MAXLENGTH=10 SIZE=10><BR> Age <P> <INPUT TYPE=TEXT NAME="AGE" MAXLENGTH=3 onChange="CheckAge(PHIEU_DIEU_TRA)"><BR> SIZE=2
B n thch ma no nh t:<BR>
Ma xun<INPUT TYPE=RADIO NAME="MUA" VALUE="Mua xuan"> Ma h <INPUT TYPE=RADIO NAME="MUA" VALUE="Mua ha"> Ma thu<INPUT TYPE=RADIO NAME="MUA" VALUE="Mua thu"> Ma ng<INPUT TYPE=RADIO NAME="MUA" VALUE="Mua dong"> <P>
Hy ch n nh ng ho t
ng ngoi tr i m b n yu thch:<BR>
i b <INPUT TYPE=CHECKBOX NAME="HOAT_DONG" VALUE="Di bo">
Trang 38/109
Tr t tuy t<INPUT TYPE=CHECKBOX NAME="HOAT_DONG" VALUE="Truot tuyet"> Th thao d i n c<INPUT TYPE=CHECKBOX VALUE="Duoi nuoc"> NAME="HOAT_DONG"
p xe<INPUT TYPE=CHECKBOX NAME="HOAT_DONG" VALUE="Dap xe"> <P> <INPUT TYPE=SUBMIT> <INPUT TYPE=RESET> </FORM> </BODY> </HTML>
Hnh 5.10: Minh ho cho v d Event Handler
BI T P
3.1.12. CU H I 1. Vi t m t o n l nh JavaScript s d ng cch th c confirm() v cu l nh if...then th c hi n:
Trang 39/109 H i ng i s d ng c mu n nh n c m t l i cho khng N u c th hi n nh wellcome.jpg v m t l i cho. N u khng th vi t ra m t l i thng bo 2. Vi t m t o n l nh JavaScript th c hi n: H i ng i s d ng: "10+10 b ng bao nhiu?" N u ng th h i ti p: C mu n tr l i cu th hai khng?" N u mu n th h i: "10*10 b ng bao nhiu?" nh gi k t qu b ng bi u th c logic sau vi t ra mn hnh: ng: "CORRECT"; Sai: "INCORRECT" G i : S d ng bi n ton c c lu k t qu ng so snh v i k t q a a vo. 3. Cu l nh no trong cc cu sau y s d ng sai th s ki n a. <BODY onClick="doSomething();"> b. <INPUT TYPE=text onFocus="doSomething();"> c. <INPUT TYPE=textarea onLoad="doSomething();"> d. <BODY onUnload="doSomething();"> e. <FORM onLoad="doSomething();"> f. <FORM onSubmit="doSomething();"> 4. i u g x y ra khi th c hi n script sau:
<HTML> <HEAD> <TITLE>Exercise 5.4</TITLE> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> <BODY onLoad="welcome();" onUnload="farewell();";> This is my page! </BODY> </HTML>
5. S d ng vng l p while a.
for (j = 4; j > 0; j --) {
m ph ng cc vng l p for sau:
Trang 40/109
document.writeln(j + "<BR>"); }
b.
for (k = 1; k <= 99; k = k*2) { k = k/1.5; }
c.
for (num = 0; num <= 10; num ++) { if (num == 8) break; }
3.1.13. TR
L I
1. S d ng cch th c confirm() v c u trc if...then:

<HTML> <HEAD> <TITLE>Execise 5.1</TITLE> <HEAD> <BODY> <P> <SCRIPT LANGUAGE="JavaScript"> var conf=confirm("Click OK to see a wellcome message!") if (conf){ document.write("<IMG SRC='wellcome.jpg'>"); document.write("<BR>Wellcome you come to CSE's class"); } else document.write("What a pity! You have just click Cancel button"); </SCRIPT> </P> </BODY> </HTML>
2. Th c hi n h i ng
i s d ng:
<HTML> <HEAD> <TITLE>Exercise 3.3</TITLE> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> <BODY> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </BODY> </HTML>
3. Cc cu sai: a, c, e. Cc cu ng: b, d, f 4. Khi Ch ng trnh c ch y (load), hm wellcome s th c hi n h i tn ng i s d ng, lu tn vo bi n ton c c name. Khi ng i s d ng sang m t a ch URL khc, hm farewell() s th c hi n g i m t l i c m n t i ng i s d ng. 5. S d ng vng l p while nh sau: a.
j = 5; while (--j > 0) { document.writeln(j + "<BR>"); }
Trang 42/109 b.
k = 1; while (k <= 99) { k = k * 2 / 1.5; }
c.
num = 0; while (num <= 10) { if (num++ == 8) break; }
Trang 43/109
4.
CC
IT
NG TRONG JAVASCRIPT
Nh ni JavaScript l ngn ng l p trnh d a trn i t ng, nh ng khng h ng i t ng b i v n khng h tr cc l p c ng nh tnh th a k . Ph n ny ni v cc i t ng trong JavaScript v hnh 6.1 ch ra s phn c p cc i t ng. Trong s phn c p cc i t ng c a JavaScript, cc i t ng con th c s l cc thu c tnh c a cc i t ng b m . Trong v d v Ch ng trnh x l s ki n tr c y form tn PHIEU_DIEU_TRAl thu c tnh c a i t ng document v tr ng text AGE l thu c tnh c a form PHIEU_DIEU_TRA. tham chi u n gi tr c a AGE, b n ph i s d ng:
document.PHIEU_DIEU_TRA.AGE.value
Cc i t ng c thu c tnh (properties), Ph ng th c (methods), v cc Ch ng trnh x l s ki n (event handlers) g n v i chng. V d i t ng document c thu c tnh title ph n nh n i dung c a th <TITLE> c a document. Bn c nh b n th y Ph ng th c document.write c s d ng trong nhi u v d a v n b n k t qu ra document. i t ng c ng c th c cc Ch ng trnh x l s ki n. V d i t ng link c hai Ch ng trnh x l s ki n l onClick v onMouseOver. onClick c g i khi c i t ng link c kch, onMouseOver c g i khi con tr chu t di chuy n qua link. Khi b n t i m t document xu ng Navigator, n s t o ra m t s i t ng cng v i nh ng gi tr cc thu c tnh c a chng d a trn file HTML c a document v m t vi thng tin c n thi t khc. Nh ng i t ng ny t n t i m t cch c c p b c v ph n nh chnh c u trc c a file HTML .
Trang 44/109 Window Texturea Text Plugin Frame Layer Link document Image Area Location Anchor Applet History Plugin Form Checkbox Button Select Hnh 6.1: S S 1 - Phn c p it ng Navigator it ng ny Option FileUpload Mime Type Password Hidden Submit Reset Radio navigator
sau s minh ho s phn c p c a cc
Trong s phn c p ny, cc i t ng con chnh l cc thu c tnh c a m t i t ng cha. V d nh m t form tn l form1 chnh l m t i t ng con c a i t ng document v c g i t i l document.form1 T t c cc trang u c cc i t ng sau y: navigator: c cc thu c tnh tn v phin b n c a Navigator ang c s d ng, dng cho MIME type c h tr b i client v plug-in c ci t trn client. window: l i t ng m c cao nh t, c cc thu c tnh th c hi n p d ng vo ton b c a s . document: ch a cc thu c tnh d a trn n i dung c a document nh tn, mu n n, cc k t n i v cc forms.
Trang 45/109 location: c cc thu c tnh d a trn a ch URL hi n th i history: Ch a cc thu c tnh v cc URL m client yu c u tr c . Sau y s m t cc thu c tnh, Ph ng th c c ng nh cc Ch ng trnh x l s ki n cho t ng i t ng trong JavaScript.
IT
it it
NG NAVIGATOR
ng ny c s d ng t c cc thng tin v trnh duy t nh s phin b n. ng ny khng c Ph ng th c hay Ch ng trnh x l s ki n. Cc thu c tnh appCodeName AppName AppVersion userAgent Xc Xc Xc Xc nh tn m n i t i c a trnh duy t (Atlas). nh tn trnh duy t. nh thng tin v phin b n c a nh header c a user - agent. it ng navigator.
V d V d sau s hi n th cc thu c tnh c a
it
ng navigator
<HTML> <HEAD> <TITLE> Navigator Object Exemple </TITLE> <SCRIPT LANGUAGE= "JavaScript"> document.write("appCodeName = "+navigator.appCodeName + "<BR>"); document.write("appName = "+navigator.appName + "<BR>"); document.write("appVersion = "+navigator.appVersion + "<BR>"); document.write("userAgent = "+navigator.userAgent + "<BR>"); </SCRIPT> </HEAD> <BODY> </BODY> </HTML>
Trang 46/109
Hnh 6.2: Minh ho cho
it
ng Navigator
IT
NG WINDOW
i t ng
i t ng window nh ni trn l i t ng m c cao nh t. Cc document, frame, v tr u l thu c tnh c a i t ng window. 4.1.1. CC THU C TNH
defaultStatus - Thng bo ng m nh hi n th ln trn thanh tr ng thi c a c as Frames - M ng xc nh t t c cc frame trong c a s . Length - S l ng cc frame trong c a s cha m . Name - Tn c a c a s hi n th i. Parent - i t ng c a s cha m Self - C a s hi n th i. Status c s d ng cho thng bo t m th i hi n th ln trn thanh th ng thi c a s . c s d ng l y hay t l i thng bo tr ng thi v ghi ln defaultStatus. Top - C a s trn cng. Window - C a s hi n th i.
Trang 47/109 4.1.2. CC PH NG TH C
alert ("message") -Hi n th h p h i tho i v i chu i "message" v nt OK. clearTimeout(timeoutID) -Xa timeout do SetTimeout t. SetTimeout tr l i timeoutID windowReference.close - ng c a s windowReference. confirm("message") -Hi n th h p h i tho i v i chu i "message", nt OK v nt 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 vo tr ng text. TimeoutID = setTimeout(expression,msec) - nh gi bi u th c expresion sau th i gian msec. V d : S d ng tn 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 tnh TARGET c a th FORM v A). Trong v d t o ra m t t i c a s th hai, nh nt th nh t m m t c a s r ng, sau m t lin k t s t i file doc2.html xu ng c a s m i r i m t nt khc dng ng c a s th hai l i, v d ny la vo file window.html:
<HTML> <HEAD> <TITLE>Frame Example </TITLE> </HEAD> <BODY> <FORM> <INPUT TYPE="button" VALUE="Open Second Window" onClick="msgWindow=window.open('','window2','resizable=no,width=200,heig ht=200')"> <P> <A HREF="doc2.html" TARGET="window2"> Load a file into window2 </A> </P> <INPUT TYPE="button" VALUE="Close Second Window" onClick="msgWindow.close()"> </FORM> </BODY> </HTML>
Trang 48/109
Hnh 6.3: Minh ho cho 4.1.3. CC CH NG TRNH X L S
it
ng c a s
KI N
onLoad - Xu t hi n khi c a s k t thc vi c t i. onUnLoad - Xu t hi n khi c a s c lo i b .
IT
NG LOCATION
Cc thu c tnh c a i t ng location duy tr cc thng tin v URL c a document hi n th i. i t ng ny hon ton khng c cc Ph ng th c v Ch ng trnh x l s ki n i km. V d : http:// www.abc.com/ chap1/page2.html#topic3 Cc thu c tnh hash - Tn 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 - Tn c a host v domain (v d www.abc.com ). href - Ton 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 thng c s d ng cho my tnh host, th ng l c ng ng m nh. Protocol - Giao th c c s d ng (cng v i d u hai ch m) (v d http:). Search - Cu truy v n tm ki m c th cu i URL cho cc script CGI.
Trang 49/109
IT
NG FRAME
M t c a s c th c m t vi frame. Cc frame c th cu n m t cch c l p v i nhau v m i frame c URL ring. frame khng c cc Ch ng trnh x l s ki n. S ki n onLoad v onUnLoad l c a i t ng window. 4.1.4. CC THU C TNH frames - M ng t t c cc frame trong c a s . Name - Thu c tnh NAME c a th <FRAME> Length - S l ng cc frame con trong m t frame. Parent - C a s hay frame ch a nhm frame hi n th i. self - frame hi n th i. Window - frame hi n th i. 4.1.5. CC 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. 4.1.6. S D NG FRAME 4.1.6.1. a) T o m t frame (create) nh ngh a m t
t o m t frame, ta s d ng th FRAMESET. M c ch c a th ny l t p cc frame trong m t trang. V d 1: t o frame ( hnh 17)
<HTML> <HEAD> <TITLE>Frame Example </TITLE> <FRAMESET ROWS="90%,10%"> <FRAMESET COLS="30%,70%"> <FRAME SRC=CATEGORY.HTM NAME="ListFrame"> <FRAME SRC=TITLES.HTM NAME="contentFrame"> </FRAMESET > <FRAME SRC=NAVIGATOR.HTM NAME="navigateFrame"> </FRAMESET > </HEAD> <BODY> </BODY> </HTML>
S sau hi n th c u trc c a cc frame: C 3 frame u trn cng m t c a s cha, m c d 2 trong s cc frame n m trong m t frameset khc.
Trang 50/109 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 cch s d ng thu c tnh frames nh sau: listFrame chnh l top.frames[0] contentFrame chnh l top.frames[1] navigatorFrame chnh l top.frames[2]
Hnh 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 nh ng trong m i nh c a hai frame l i c m t c a s cha ring t navigateFrame. M c frameset cao nh t c th c nh ngh a nh sau:
<HTML>
Trang 51/109
<HEAD> <TITLE>Frame Example </TITLE> <FRAMESET ROWS="90%,10%"> <FRAME SRC=muske13.HTML NAME="upperFrame"> <FRAME SRC=NAVIGATOR.HTM NAME="navigateFrame"> </FRAMESET > </HEAD> <BODY> </BODY> </HTML>
Trong file muske13.html l i ti p t c
t m t frameset:
<HTML> <HEAD> <TITLE>Frame Example </TITLE> <FRAMESET COLS="30%,70%"> <FRAME SRC=CATEGORY.HTM NAME="ListFrame"> <FRAME SRC=TITLES.HTM NAME="contentFrame"> </FRAMESET > </HEAD> <BODY> </BODY> </HTML>
Khi k t qu hi n th c a v d 2 gi ng v d 1 nh ng s phn c p c a cc frames l i top listFrame (category.html) upperFrame (muske13.html) contentFrame (titles.html) navigatorFrame (navigator.html) khc h n: B n c th g i t i cc frame trn b ng cch s d ng thu c tnh m ng frames nh sau: upperFrame chnh l top.frames[0] navigatorFrame chnh l top.frames[1] listFrame chnh l upperFrame.frames[0] ho c top.frames[0].frames[0] contentFrame chnh l upperFrame.frames[1] ho c top.frames[0].frames[1]
Trang 52/109 4.1.6.2. b) C p nh t m t frame (update) t
B n c th c p nh t n i dung c a m t frame b ng cch s d ng thu c tnh location a ch URL v ph i nh ch r v tr c a frame trong c u trc. Trong v d trn, n u b n thm m t dng sau vo navigatorFrame:
<INPUT TYPE="button" VALUE="Titles only" onClick="top.frames[0].location='artist.html'">
th khi nt Titles only c nh n, file artist.html s c t i vo upperFrame, v hai frame listFrame, contentFrame s b ng l i nh chng cha bao gi t n t i.
IT
NG DOCUMENT
i t ng ny ch a cc thng tin v document hi n th i v cung c p cc Ph ng th c a thng tin ra mn hnh. i t ng document c t o ra b ng c p th <BODY> v </BODY>. M t s cc thu c tnh g n v i th <BODY>. Cc i t ng anchor, forms, history, links l thu c tnh c a i t ng document. Khng c cc Ch ng trnh x l s ki n cho cc frame. S ki n onLoad v onUnLoad l cho i t ng window. 4.1.7. CC THU C TNH alinkColor - Gi ng nh thu c tnh ALINK. anchor - M ng t t c cc anchor trong document. bgColor - Gi ng thu c tnh BGCOLOR. cookie - S d ng xc nh cookie. fgColor - Gi ng thu c tnh TEXT. forms - M ng t t c cc form trong document. lastModified - Ngy cu i cng v n b n c s a. linkColor - Gi ng thu c tnh LINK. links - M ng t t c cc 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 <TITLE>. vlinkColor - Gi ng thu c tnh VLINK. 4.1.8. CC PH NG TH C
document.clear - Xo document hi n th i. document.close - ng dng d li u vo v a ton b d li u trong b m ra mn hnh. document.open (["mineType"]) - M m t stream thu th p d li u vo c a cc phwong th c write v writeln. document.write(expression1 [,expression2]...[,expressionN]) - Vi t bi u th c HTML ln v n b n trng m t c a s xc nh.
Trang 53/109 document.writeln (expression1 [,expression2] ... [,expressionN] ) Gi ng Ph ng th c trn nh ng khi h t m i bi u th c l i xu ng dng.
IT
NG ANCHORS
anchor l m t o n v n b n trong document c th dng lm ch cho m t siu lin k t. N c xc nh b ng c p th <A> v </A>. i t ng anchor khng c thu c tnh, Ph ng th c c ng nh Ch ng trnh x l s ki n. M ng anchor tham chi u n m i anchor c tn trong document. M i anchor c tham chi u b ng cch:
document.anchors [index]
M ng anchor c m t thu c tnh duy nh t l length xc document, n c th c xc nh nh sau:

document.anchors.length.
nh s l ng cc anchor trong
IT
NG FORMS
Cc form c t o ra nh c p th <FORM> v </FORM>. Ph n l n cc thu c tnh c a i t ng form ph n nh cc thu c tnh c a th <FORM>. C m t vi ph n t (elements) l thu c tnh c a i t ng forms:
button checkbox hidden password radio reset select submit text textarea
Cc ph n t ny s c trnh by sau. N u document ch a m t vi form, chng c th ng cc form c th c xc nh nh sau:

document.forms.length.
c tham chi u qua m ng forms. S l-
M i m t form c th
c tham chi u nh sau:
document.forms[index]
4.1.9. CC THU C TNH action thu c tnh ACTION c a th FORM. elements M ng ch a t t c cc thnh ph n trong m t form (nh checkbox, tr ng text, danh sch l a ch n encoding Xu 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 cc thnh ph n trong m t form. method Thu c tnh METHOD.
Trang 54/109 target Xu ch a tn c a c a s NG TH C ng ch khi submit form
4.1.10. CC PH
formName.submit () - Xu t d li u c a m t form tn formName t i trang x l. Ph th c ny m ph ng m t click vo nt submit trn form. 4.1.11. CC CH onSubmit - Ch t form i. NG TRNH X L S KI N c g i khi ng
ng trnh x l s ki n ny
i s d ng chuy n d li u
IT
NG HISTORY
i t ng ny c s d ng lu gi cc thng tin v cc URL tr c c ng i s d ng s d ng. Danh sch cc URL c lu tr theo th t th i gian. i t ng ny khng c Ch ng trnh x l s ki n. 4.1.12. CC THU C TNH length - S l ng cc URL trong 4.1.13. CC PH NG TH C it ng.
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 sch. N s khng gy hi u ng g n u n cu i c a danh sch. history.go (delta | "location") c s d ng chuy n ln hay chuy n xu ng delta b c hay di chu n n URL xc nh b i location trong danh sch. N u delta c s d ng th vi c d ch chuy n ln pha trn khi delta dng v xu ng pha 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.
IT
NG LINKS
i t ng link l m t o n v n b n hay m t nh c xem l m t siu lin k t. Cc thu c tnh c a i t ng link ch y u x l v URL c a cc siu lin k t. i t ng link c ng khng c Ph ng th c no. M ng link ch a danh sch t t c cc lin k t trong document. C th xc nh s l ng cc link qua document.links.length() C th tham chi u t i m t lin k t q a document.links [index] xc nh cc thu c tnh c a i t ng link, c th s d ng URL t ng t : http://www.abc.com/chap1/page2.html#topic3 4.1.14. CC THU C TNH
Trang 55/109 hash - Tn 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 - Tn c a host v domain (v d ww.abc.com). href - Ton 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 thng c s d ng cho my tnh host, th ng l c ng ng m nh. Protocol - Giao th c c s d ng (cng v i d u hai ch m) (v d http:). Search - Cu truy v n tm ki m c th cu i URL cho cc script CGI. Target - Gi ng thu c tnh TARGET c a <LINK>. 4.1.15. CC CH NG TRNH X L S KI N
onClick - X y ra khi ng i s d ng nh n vo link. onMouseOver - X y ra khi con chu t di chuy n qua link.
IT
NG MATH
i t ng Math l i t ng n i t i trong JavaScript. Cc thu c tnh c a i t ng ny ch a nhi u h ng s ton h c, cc hm ton h c, l ng gic ph bi n. i t ng Math khng c Ch ng trnh x l s ki n. Vi c tham chi u t i number trong cc Ph ng th c c th l s hay cc bi u th c c nh gi l s h p l . 4.1.16. CC THU C TNH E - H ng s Euler, kho ng 2,718. LN2 - logarit t nhin c a 2, kho ng 0,693. LN10 - logarit t nhin c a 10, kho ng 2,302. LOG2E - logarit c s 2 c a e, kho ng 1,442. PI - Gi tr c a T, 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. 4.1.17. CC 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 nguyn nh nh t l n h n ho c b ng number.
Trang 56/109 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 nguyn l n nh t nh h n ho c b ng number. Math.log (number) - Tr l i logarit t nhin 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 nhin gi a 0 v 1. Phwong th c ny ch th c hi n c trn n n t ng UNIX. Math.round (number) - Tr l i gi tr c a number lm trn t i s nguyn 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.
IT
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 ngy thng. i t ng Date khng c thu c tnh v Ch ng trnh x l s ki n. Ph n l n cc Ph ng th c date u c m t i t ng Date i cng. Cc Ph ng th c gi i thi u trong ph n ny s d ng i t ng Date dateVar, v d :
dateVar = new Date ('August 16, 1996 20:45:04');
4.1.18. CC PH
NG TH C
dateVar.getDate() - Tr l i ngy trong thng (1-31) cho dateVar. dateVar.getDay() - Tr l i ngy 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 pht (0-59) cho dateVar. dateVar.getSeconds() - Tr l i giy (0-59) cho dateVar. dateVar.getTime() - Tr l i s l ng cc mili giy t 00:00:00 ngy 1/1/1970. dateVar.getTimeZoneOffset() - Tr l i d ch chuy nb ng pht 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) - Phn tch chu i dateStr v tr l i s l ng cc mili giy tnh t 00:00:00 ngy 01/01/1970. dateVar.setDay(day) - t ngy trong thng l day cho dateVar.
Trang 57/109 dateVar.setHours(hours) - t gi l hours cho dateVar. dateVar.setMinutes(minutes) - t pht l minutes cho dateVar. dateVar.setMonths(months) - t thng l months cho dateVar. dateVar.setSeconds(seconds) - t giy l seconds cho dateVar. dateVar.setTime(value) - t th i gian l value, trong value bi u di n s l ng mili giy t 00:00:00 ngy 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 lng mili giy t 00:00:00 01/01/1970 GMT.
IT
NG STRING
i t ng String l i t ng c xy d ng n i t i trong JavaScript cung c p nhi u Ph ng th c thao tc trn chu i. i t ng ny c thu c tnh duy nh t l di (length) v khng c Ch ng trnh x l s ki n. 4.1.19. CC PH NG TH C
str.anchor (name) c s d ng t o ra th <A> (m t cch ng). Tham s name l thu c tnh NAME c a th <A>. str.big() - K t qu gi ng nh th <BIG> trn chu i str. str.blink() - K t qu gi ng nh th <BLINK> trn chu i str. str.bold() - K t qu gi ng nh th <BOLD> trn 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 <TT> trn chu i str. str.fontcolor() - K t qu gi ng nh th <FONTCOLOR = color>. str.fontsize(size) - K t qu gi ng nh th <FONTSIZE = size>. str.index0f(srchStr [,index]) - Tr l i v tr trong chu i str v tr xu t hi n u tin c a chu i srchStr. Chu i str c tm t tri sang ph i. Tham s index c th c s d ng xc nh v tr b t u tm ki m trong chu i. str.italics() - K t qu gi ng nh th <I> trn chu i str. str.lastIndex0f(srchStr [,index]) - Tr l i v tr trong chu i str v tr xu t hi n cu i cng c a chu i srchStr. Chu i str c tm t ph i sang tri. Tham s index c th c s d ng xc nh v tr b t u tm 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 lin k t. str.small() - K t qu gi ng nh th <SMALL> trn chu i str. str.strike() - K t qu gi ng nh th <STRIKE> trn chu i str. str.sub() - T o ra m t subscript cho chu i str, gi ng th <SUB>.
Trang 58/109 str.substring(a,b) - Tr l i chu i con c a str l cc k t t v tr th a t i v tr th b. Cc k t c m t tri sang ph i b t u t 0. str.sup() - T o ra superscript cho chu i str, gi ng th <SUP>. str.toLowerCase() i chu i str thnh ch th ng. str.toUpperCase() i chu i str thnh ch hoa.
CC PH N T
C A
IT
NG FORM
Form c t o b i cc ph n t cho php ng i s d ng a thng tin vo. Khi , n i dung (ho c gi tr ) c a cc ph n t s c chuy n n m t Ch ng trnh trn 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 chn vo HTML c a b n lm vi c v i cc ph n t c a form v cc gi tr c a chng. B ng ?: Cc ph n t c a form Ph n t M t L m t nt b m h n l nt submit hay nt reset (<INPUT TYPE="button">) M t checkbox (<INPUT TYPE="checkbox">) L m t ph n t t i file ln cho php ng i s d ng g i ln m t file
button checkbox FileUpload hidden password radio reset select submit text textArea
M i ph n t c th
(<INPUT TYPE="file">)
M t tr ng n (<INPUT TYPE="hidden">) u M t tr ng text nh p m t kh u m t t c cc k t nh p vo hi n th l d u (*)(<INPUT TYPE="password">) M t nt b m (<INPUT TYPE="radio">) M t nt reset(<INPUT TYPE="reset">) M t danh sch l a ch n (<SELECT><OPTION>option1</OPTION>
<OPTION>option2</OPTION></SELECT>)
M t nt submit (<INPUT TYPE="submit">) M t tr ng text (<INPUT TYPE="text">)
M t tr
c
ng text cho php nh p vp nhi u dng

t tn JavaScript truy nh p n chng qua tn
<TEXTAREA>default text</TEXTAREA>)
4.1.20. THU C TNH TYPE
Trang 59/109 Trong m i ph n t c a form u c thu c tnh type, l m t xu ch ph n t c a vo nh nt b m, m t tr ng text hay m t checkbox... Xu c th l m t trong cc 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" 4.1.21. PH N T BUTTON nh r ki u c a
Trong m t form HTML chu n, ch c hai nt 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 vi 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: <INPUT TYPE="button" NAME="name" VALUE= "buttonName"> Trong th INPUT, name l tn c a button, thu c tnh VALUE c ch a nhn c a button s c hi n th trn 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 cch th c duy nh t click.Ph n t buttton c kh n ng m r ng cho php ng i l p trnh JavaScript c th vi t c m t o n m l nh JavaScript th c thi vi c thm vo m t nt 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.
<HTML> <HEAD> <TITLE>button Example</TITLE> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD>
Trang 60/109
<BODY> <FORM METHOD=POST> Enter a JavaScript mathematical expression: <INPUT TYPE="text" NAME="entry" VALUE=""> <BR> The result of this expression is: <INPUT TYPE=text NAME="results" onFocus="this.blur();"> <BR> <INPUT TYPE="button" VALUE="Calculate" onClick="calculate(this.form);"> </FORM> </BODY> </HTML>
4.1.22. PH N T
CHECKBOX
Cc ph n t checkbox c kh n ng b t t t dng ch n ho c khng ch n m t thng tin. Cc checkbox c nhi u thu c tnh v cch th c h n button. B ng d i y l danh sch cc thu c tnh v cc cch th c c a ph n t checkbox. B ng . Cc thu c tnh v cch th c c a ph n t checkbox. Cch th c v thu c tnh
checked defaultChecked name value click()
M t Cho bi t tr ng thi hi n th i c a checkbox (thu c tnh) Cho bi t tr ng thi m c Cho bi t tn c a ph n t tnh) nh c a ph n t (thu c tnh) c ch nh trong th INPUT (thu c c ch nh trong th
Cho bi t gi tr hi n th i c a ph n t INPUT (thu c tnh) M t m t click vo checkbox (Cch 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 vo m t s r i l a ch n tnh nhn i v bnh Ph

<HTML> <HEAD> <TITLE>checkbox Example</TITLE> <SCRIPT>  </SCRIPT> </HEAD> <BODY> <FORM METHOD=POST> Value: <INPUT TYPE="text" NAME="entry" VALUE=0 onChange="calculate(this.form,this.name);"> <BR> Action (default double): <INPUT TYPE=checkbox NAME=square onClick="calculate(this.form,this.name);"> Square <BR> Result: <INPUT TYPE="text" NAME="result" VALUE=0 onChange="calculate(this.form,this.name);"> </FORM> </BODY> </HTML>
Trong script ny, b n th y cch s d ng th s ki n onClick c ng nh thu c tnh checked l m t gi tr ki u Boolean c th dng lm i u ki n trong cu l nh if...else B n c th thm m t checkbox tn l square vo form. N u h p ny c check, Ch ng trnh s l y gi tr c a n, n u khng, m t th c thi c m c nh s nhn i gi tr c a n. Th s ki n onClick trong checkbox c nh ngh a:
(<INPUT TYPE=checkbox NAME=square onClick= "calculate( this.form, this.name);"> )
Khi n u ng i dng thay i m t cu l nh khc, form s c tnh ton l i. t o ra s m r ng cho checkbox. b n c th thay i hm calculate() nh sau:
function calculate(form,callingField) { if (callingField == "result") { // if (1)
Trang 62/109
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) }
4.1.23. PH N T
FILE UPLOAD
Ph n t ny cung c p cho form m t cch ng i s d ng c th ch r m t file a vo 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 tnh l name v value, c hai u l gi tr xu nh cc i t ng khc. Khng c cch th c hay th file cho i t ng ny. 4.1.24. PH N T HIDDEN
Ph n t hidden l ph n t duy nh t trong s t t c cc ph n t c a form khng c hi n th trn Web browser. Tr ng hidden c th s d ng lu cc gi tr c n thi t g it i server song song v i s xu t ra t form (form submission) nh ng n khng c hi n th trn trang. M i ng i c th s d ng trong JavaScript lu cc gi tr trong su t m t script v tnh ton khng c n form. i t ng hidden ch c hai thu c tnh l name v value, c ng l nh ng gi tr xu gi ng cc i t ng khc. Khng c cch th c hay th s ki n no cho i t ng ny. 4.1.25. PH N T PASSWORD
i t ng Password l i t ng duy nh t trong cc i t ng c a form m khi g b t k k t no vo c ng u hi n th d u sao(*). N cho php a vo nh ng thng tin b m t nh ng k m t kh u... i t ng Password c 3 thu c tnh gi ng tr ng text l: defaultValue, name v value. Khng gi ng v i hai ph n t trn, tr ng Password c nhi u cch th c h n(focus(), blur(), and select() ) v t ng ng v i cc th s ki n: onFocus, onBlur, and onSelect. Ph n ny s c ni k h n trong i t ng text. 4.1.26. PH N T RADIO
Trang 63/109 i t ng radio g n gi ng s b t t t checkbox khi c hai nt radio k t h p thnh m t nhm. Khi nhi u radio c k t h p thnh m t nhm, ch c m t nt c ch n trong b t k m t th i i m no. V d dng l nh sau t o ra m t nhm radio c ba nt tn l test:
<INPUT TYPE="radio" NAME="test" VALUE="1" chECKED>1<BR> <INPUT TYPE="radio" NAME="test" VALUE="2">2<BR> <INPUT TYPE="radio" NAME="test" VALUE="3">3<BR>
Nhm cc nt radio l i b ng cch t cho chng c cng m t tn trong cc th INPUT. C m t vi thu c tnh ki m tra tr ng thi hi n th i c a m t nhm nt radio. B ng sau hi n th cc thu c tnh v cch th c c a i t ng radio. B ng? . Cc thu c tnh v cch th c c a i t ng radio. Thu c tnh v cch th c
checked defaultChecked index length name value click()
M t M t tr ng thi hi n th i c a ph n t radio (thu c tnh) M t tr ng thi m c nh c a ph n t (thu c tnh) c ch n hi n th i trong m t nhm c ch nh trong th INPUT (thu c c nh ra trong th M t th t c a nt radio M t tn c a ph n t tnh)
M t t ng s nt radio trong m t nhm
M t gi tr hi n th i c a ph n t INPUT (thu c tnh)
M ph ng m t click trn nt radio (cch th c)
C ng nh checkbox, radio ch c m t th s ki n l onClick. Khng c b t k m t i t ng form no c thu c tnh index v length. Do m t nhm radio g m nhi u ph n t radio, nn chng c t trong m t m ng cc nt radio v c nh s t 0. Trong v d nhm radio c tn test trn, n u nhm n m trong m t form c tn l "testform", b n c th g i t i nt radio th hai b ng tn "testform.test[1]" v c th ki m tra gi tr c a n b ng "testform.test[1].checked" minh ho r cch dng i t ng radio, ta xem v d sau: V d :
<HTML> <HEAD> <TITLE>radio button Example</TITLE> <SCRIPT>  </SCRIPT> </HEAD> <BODY> <FORM METHOD=POST> Value: <INPUT TYPE="text" NAME="entry" VALUE=0 onChange="calculate(this.form,this.name);"> <BR> Action:<BR> <INPUT TYPE="radio" NAME="action" VALUE="twice" onClick="calculate(this.form,this.name);"> Double<BR> <INPUT TYPE="radio" NAME="action" VALUE="square" onClick="calculate(this.form,this.name);"> Square <BR> Result: <INPUT TYPE=text NAME="result" VALUE=0 onChange="calculate(this.form,this.name);"> </FORM> </BODY> </HTML>
Trong v d ny, s thay i t checkbox trn l r t kh nh n bi t. Thay cho m t checkbox trong v d tr c, y ta s d ng hai nt radio v i hai gi tr khc nhau: double v square Nh ta bi t c th truy nh p n cc nt radio qua m t m ng, do hai nt ny c th truy nh p b ng action[0] v action[1]. B ng cch ny, b n ch c n thay i tham chi u n hm calculate() t form.square.checked thnh form.action[1].checked. 4.1.27. PH N T RESET
S d ng i t ng reset, b n c th tc ng ng c l i click vo nt Reset. C ng gi ng i t ng button, i t ng reset c hai thu c tnh l name v value, v m t cch th c click(), m t th s ki n onClick. H u h t nh ng ng i l p trnh khong s d ng th s ki n onClick c a nt reset ki m tra gi tr c a nt ny, i t ng reset th ng dng xo form. V d sau minh ho cch s d ng nt reset xo cc gi tr c a form.
Trang 65/109 V d :
<HTML> <HEAD> <TITLE>reset Example</TITLE> <SCRIPT LANGUAGE="JavaScript">  //SCRIPT> </HEAD> <BODY> <FORM METHOD=POST> <INPUT TYPE="text" NAME="value1"><BR> <INPUT TYPE="text" NAME="value2"><BR> <INPUT TYPE="reset" VALUE="Clear Form" onClick="clearForm(this.form);"> </FORM> </BODY> </HTML>
4.1.28. PH N T
SELECT
Danh sch l a ch n trong cc form HTML xu t hi n menu drop-down ho c danh sch cu n c c a cc i t ng c th c l a ch n. Cc danh dch c xy d ng b ng cch s d ng hai th SELECT v OPTION. V d :
<SELECT NAME="test"> <OPTION SELECTED>1 <OPTION>2 <OPTION>3 </SELECT>
t o ra ba thnh ph n c a menu th drop-down v i ba l a ch n 1,2 v 3. S d ng thu c tnh SIZE b n c th t o ta m t danh sch 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 thnh ph n hi n th , b n c th s d ng nh sau:
<SELECT NAME="test" SIZE=2> <OPTION SELECTED>1 <OPTION>2 <OPTION>3 </SELECT>
Trang 66/109 Trong c hai v d trn, ng i s d ng ch c th c m t l a ch n. N u s d ng thu c tnh MULTIPLE, b n c th cho php ng i s d ng l a ch n nhi u h n m t gi tr trong danh sch l a ch n:
<SELECT NAME="test" SIZE=2 MULTIPLE> <OPTION SELECTED>1 <OPTION>2 <OPTION>3 </SELECT>
Danh sch l a ch n trong JavaScript l i t ng select. i t ng ny t o ra m t vi thnh ph n t ng t cc button v radio. V i cc thnh ph n l a ch n, danh sch cc l a ch n c ch a trong m t m ng c nh s t 0. Trong tr ng h p ny, m ng l m t thu c tnh c a i t ng select g i l options. C vi c l a ch n cc option v t ng ph n t option ring bi t u c nh ng thu c tnh. B sung thm vo m ng option, ph n t select c thu c tnh selectedIndex, c ch a s th t c a option c l a ch n hi n th i. M i option trong danh sch l a ch n u c m t vi thu c tnh: DEFAULTSELECTED: cho bi t option c c m c nh l l a ch n trong th OPTION hay khng. 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 thi hi n th i c a option TEXT: c ch a gi tr c a dng text hi n th trn menu cho m i option, v thu c tnh value m i gi tr ch ra trong th OPTION. i t ng select khng c cc cch th c c nh ngh a s n. Tuy nhin, i t ng select c ba th s ki n, l onBlue, onFocus, onChange, chng u l nh ng i t ng text. V d b n c danh sch l a ch n sau:
<SELECT NAME="example" onFocus="react();"> <OPTION SELECTED VALUE="Number One">1 <OPTION VALUE="The Second">2 <OPTION VALUE="Three is It">3 </SELECT>
Khi l n
u tin hi n th b n c th truy nh p t i cc thng 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 kch vo 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 tnh s l:

example.options[1].value = "The Second" example.options[2].text = "3"
Trang 67/109
example.selectedIndex = 1 example.options[0].defaultSelected = true example.options[1].selected = true
S a cc danh sch l a ch n
Navigator 3.0 cho php thay i n i dung c a danh sch l a ch n t JavaScript b ng cch lin k t cc gi tr m i cho thu c tnh text c a cc th c th trong danh sch. V d , trong v d tr c, b n t o ra m t danh sch l a ch n nh sau:
<SELECT NAME="example" onFocus="react();"> <OPTION SELECTED VALUE="Number One">1 <OPTION VALUE="The Second">2 <OPTION VALUE="Three is It">3 </SELECT> C th thay i c dng text hi n th trn nt th hai thnh "two" b ng: example.options[1].text = "two"; C th thm cc l a ch n m i vo danh sch b ng cch s d ng i t ng xy d ng Option() theo c php: newOptionName = new Option(optionText, optionValue, defaultSelected, selected); selectListName.options[index] = newOptionName; Vi c t o i t ng option() ny v i dng text c ch tr c, defaultSelected v selected nh trn nh ra nh ng gi tr ki u Boolean. i t ng ny c lin k t vo danh sch l a ch n c th c hi n b ng index. Cc l a ch n c th b xo trong danh sch l a ch n b ng cch g n gi tr null cho i t ng mu n xo selectListName.options[index] = null; 1.1 Ph n t submit Nt Submit l m t tr ng h p c bi t c a button, c ng nh nt Reset. Nt ny a thng tin hi n t i t cc tr ng c a form t i a ch URL c ch ra trong thu c tnh ACTION c a th form s d ng cch 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 tnh name v value, cch th c click() v th s ki n onClick. 1.2 Ph n t Text
Trang 68/109
Ph n t ny n m trong nh ng ph n t hay c s d ng nh t trong cc form HTML. T ng t nh tr ng Password, tr ng text cho php nh p vo m t dng n, nh ng cc k t c a n hi n ra bnh th ng. i t ng text c ba thu c tnh:defautValue, name v value. Ba cch 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 cc s ki n ny ch th c hi n khi con tr c kch ra ngoi tr ng text. B ng sau m t cc thu c tnh v cch th c c a i t ng text. B ng .Cc thu c tnh v cch th c c a i t ng text. Cch th c v thu c tnh M t defaultValue name value focus() blur() select() Ch ra gi tr m c nh c a ph n t trong th INPUT (thu c tnh) Tn c a i t (thu c tnh) ng c ch ra
c ch ra trong th INPUT
Gi tr hi n th i c a ph n t (thu c tnh) M t vi c con tr t i tr M t vi c con tr r i tr ng text (cch th c) ng text (cch th c) ng text
M t vi c l a ch n dng text trong tr (cch th c)
M t ch quan tr ng l c th gn gi tr cho tr ng text b ng cch lin k t cc gi tr v i thu c tnh value. Trong v d sau y, dng text c a vo tr ng u tin c l p l i trong tr ng text th hai, v m i dng text c a vo tr ng text th hai l i c l p l i trong tr ng texxt th nh t. Kh n ng ny 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 cc tr ng text . <HTML> <HEAD> <TITLE>text Example</TITLE> <SCRIPT LANGUAGE="JavaScript">  </SCRIPT> </HEAD> <BODY> <FORM> <INPUT TYPE=text NAME="first" onChange="echo(this.form,this.name);"> <INPUT TYPE=text NAME="second" onChange="echo(this.form,this.name);"> </FORM> </BODY> </HTML> 1.3 Ph n t Textarea Th TEXTAREA cung c p m t h p cho php nh p s dng text do ng i thi t k nh tr c. V d : <TEXTAREA NAME="fieldName" ROWS=10 COLS=25> Default Text Here </TEXTAREA> v d ny t o ra m t tr ng text cho php a vo 10 hng ,m i hng 25 k t . Dng "Defautl Text Here"s xu t hi n trong tr ng ny vo l n hi n th u tin. C ng nh ph n t text , JavaScript cung c p cho b n cc thu c tnh defaultValue, name, v value, cc cch th c focus(), select(), v blur(), cc th s ki n onBlur, onForcus, onChange, onSelect. 2. M ng elements[] Cc 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: <FORM METHOD=POST NAME=testform> <INPUT TYPE="text" NAME="one"> <INPUT TYPE="text" NAME="two"> <INPUT TYPE="text" NAME="three">
Trang 70/109
</FORM> b n c th g i t i ba thnh ph n ny nh sau: document.elements[0], document.elements[1], document.elements[2], h n n a cn c th g i document.testform.one, document.testform.two, document.testform.three. Thu c tnh ny th ng c s d ng trong cc m i quan h tu n t c a cc ph n t h n l dng tn c a chng. 3. M ng form[] Cc th s ki n c thi t k lm vi c v i cc form ring bi t ho c cc tr ng m t th i i m, n r t h u d ng cho php g i t i cc form c lin quan trong cng m t trang. M ng form[] c p n y c th c nhi u xc nh cc nhn c a form trn cng 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 tn form. Trong script ny, b n c hai tr ng text nh p v n m trn hai form c l p v i nhau. S d ng m ng form b n c th t ng tc trn cc gi tr c a cc tr ng trong hai form cng m t lc khi ng i s d ng thay i gi tr trn m t form. <HTML> <HEAD> <TITLE>forms[] Example</TITLE> </HEAD> <BODY> <FORM METHOD=POST> <INPUT TYPE=text onChange="document.forms[1].elements[0].value = this.value;"> </FORM> <FORM METHOD=POST> <INPUT TYPE=text onChange="document.forms[0].elements[0].value = this.value;"> </FORM> </BODY> </HTML> M t khc, b n c ng c th truy nh p n form b ng tn form c t trong th FORM: <FORM METHOD=POST NAME="name">
Trang 71/109
Khi b n c th g i document.name 4. Xem l i cc l nh v m r ng L nh/ M r ng blur() form.action form.elemrnts Ki u cch JavaScript cch JavaScript thu c JavaScript thu c JavaScript thu c JavaScript thu c JavaScript cch JavaScript thu c JavaScript Th s ki n thu c HTML thu c HTML thu c HTML thu c HTML thu c
document.forms["name"]
ho c
M t th c M t vi c d ch chuy n con tr t m t ph n t th c Xu ch a gi tr c a thu c tnh ACTION trong th FORM tnh m ng ch a danh sch cc ph n t trong form (nh checkbox, tr ng text, danh sch l a ch n) tnh xu ch a ki u MIME s d ng khi chuy n thng tin t form t i server tnh Xu ch a gi tr thu c tnh NAME trong th FORM tnh Xu ch a tn c a s form submition ch b i m t
form.encoding form,name form.target form.submit type onSubmit button checkbox
th c M t vi c submit m t form HTML tnh nh x ki u c a m t ph n t thnh m t xu. th s ki n cho vi c submit tnh Thu c tnh ki u cho cc nt b m c a HTML (<INPUT TYPE=button>) tnh Thu c tnh ki u cho cc checkbox c a HTML (<INPUT TYPE=checkbox>) tnh Thu c tnh ki u cho cc dng pasword c a HTML(<INPUT TYPE=password>) tnh Thu c tnh ki u cho cc nt radio c a HTML (<INPUT TYPE=radio>) tnh Thu c tnh ki u cho cc nt reset c a form
pasword
radio reset
Trang 72/109
HTML SELECT OPTION th HTML th HTML
HTML (<INPUT TYPE=reset>) H p th cho danh sch l a ch n ch ra cc l a ch n trong danh sch l a ch n(<SELECT><OPTION>Option 1<OPTION>Option 2</SELECT>) tnh Thu c tnh ki u c a nt submit (<INPUT TYPE=submit>) tnh Thu c tnh ki u c a tr ng trong form (<INPUT TYPE=text>) H p th cho nhi u dng (<TEXTAREA> defautl </TEXTAREA>) text text
submit text TEXTAREA
thu c HTML thu c HTML Th HTML
name value
thu c JavaScript thu c JavaScript cch JavaScript thu c JavaScript thu c JavaScript thu c JavaScript cch JavaScript cch JavaScript cch JavaScript
tnh Xu ch a tn ph n t HTML (button, checkbox, password...) tnh Xu ch a gi tr hin th i c a m t ph n t HTML(button, checkbox, password...) th c M t vi c kch vo m t ph n t trn form (button, checkbox,password) tnh Th s ki n cho s ki n kch (button, checkbox, radio button, reset, selection list, submit) tnh Gi tr ki u Boolean m t m t l a ch n check(checkbox, radio button) tnh Xu ch a gi tr m c nh c a m t ph n t HTML (password, text, textarea) th c M t vi c con tr t i m t ph n t (password, text, textarea) th c M t vi c con tr r i kh i m t ph n t (password, text, textarea) th c M t vi c l a ch n dng text trong m t tr ng (password, text, textarea)
click() onClick
checked defaultChecked
focus() blur() select()
Trang 73/109
onFocus()
Th s ki n
Th s ki n cho s ki n focus(password, selection list, text, textarea) Th s ki n cho s (password, selection textarea) ki n blur list, text,
onBlur
Th s ki n
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) Th s ki n khi ng i s d ng ch n dng text trong m t tr ng (password, text, textarea) tnh L m t s nguyn m t l a ch n hi n th i trong m t nhm l a ch n (radio button) tnh S nguyn m t t ng s cc l a ch n trong m t nhm cc l a ch n (radio button) tnh Gi tr Boolean m t khi c m t l a ch n c t l m c nh (seledtion list) tnh M ng cc l a ch n trong danh sch l a ch n tnh Dng text hi n th cho m t thnh ph n c a menu trong danh sch l a ch n H p th cho cc b ng HTML H p th cho cc hng c a m t b ng HTML H p th cho cc c a m t hng trong m t b ng HTML tnh L thu c tnh c a th TD m t trong m t c a b ng c nhi u c t tnh L thu c tnh c a th TD m t trong
onSelect
Th s ki n
index
thu c JavaScript thu c JavaScript thu c JavaScript thu c JavaScript thu c JavaScript th HTML th HTML th HTML thu c HTML thu c
length
dafautlSelected
options text
TABLE TR TD COLSPAN ROWSPAN
Trang 74/109
HTML BODER thu c HTML
m t c a b ng c nhi u hng tnh L thu c tnh c a th TABLE m t r ng ng vi n c a b ng tnh m ng c a cc i t ng form v i m t danh sch cc form trong m t document th c Tr l i m t xu con c a xu string t tham s v tr k t u n v tr k t cu i th c Tr l i m t gi tr nguyn ti p theo nh h n gi tr c a tham s a vo. tnh Gi tr nguyn c a s th t k t cu i cng trong xu string
document.forms[] thu c JavaScript string.substring() cch JavaScript cch JavaScript thu c JavaScript
Math.floor() string.length
Trang 75/109
5.
M HNH
IT
IT
NG (OBJECT MODEL)
NG V THU C TNH
Nh bi t, m t i t ng trong JavaScript c cc thu c tnh i km v i n. B n c th truy nh p n cc thu c tnh c a n b ng cch g i :

objectName.propertyName
C tn i t ng v tn thu c tnh u nh y c m. B n nh ngh a m t thu c tnh b ng cch gn cho n m t gi tr . V d , gi s c m t i t ng tn l myCar (trong tr ng h p ny gi s i t ng ny t n t i s n sng). B n c th l y cc thu c tnh c tn 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 cc gi tr tham chi u t i t ng bi n. Thu c tnh v m ng trong JavaScript c quan h m t thi t v i nhau, th c ra chng ch khc nhau v cch giao ti p v i cng m t c u trc d li u. V d c ng c th truy nh p t i cc thu c tnh c a i t ng myCar trn b ng m ng nh sau:
myCar[make] = Ford myCar[model] = Mustang myCar[year] = 69;
Ki u m ng ny c hi u nh m t m ng c kh n ng lin k t b i m i m t ph n t trong u c th lin k t n m t gi tr xu no . minh ho vi c my c th c hi n nh th no, hm sau y s hi n th cc thu c tnh c a m t i t ng thng qua tham s v ki u i t ng v tn 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 hm show_props(myCar,myCar) s hi n ln:

myCar.make = Ford myCar.model = Mustang myCar.year = 69;
T O CC
IT
NG M I
Trang 76/109 C JavaScript client-side v server-side u c m t s i t ng c nh ngh a tr c. Tuy nhin, b n c ng c th t o ra nh ng i t ng c a ring 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 cch 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 hm xy d ng tr c, sau t o ra cc i t ng c ki u c a hm b ng ton t new 5.1.1. S D NG KH I T O I T NG
Trong nh ng phin b n tr c c a Navigator, b n ch c th t o ra m t i t ng b ng cch s d ng hm xy d ng chng ho c s d ng m t hm c cung c p b i m t vi i t ng khc t c m c ch. Tuy nhin, trong Navigator 4.0, b n c th t o ra m t i t ng b ng cch s d ng m t kh i t o i t ng.B n s d ng cch ny khi b n ch mu n t o ra m t c th n l ch khng ph i nhi u c th c a i t ng. C php t o ra m t i t ng b ng cch kh i t o i t ng (Object Initializers):
objectName={property1: value1, property2: value2, ..., propertyN: valueN}
Trong objectName l tn c a i t ng m i, m i propertyI l m t xc minh (c th l m t tn, m t s ho c m t xu k t ) v m i valueI l m t bi u th c m gi tr c a n c gn cho propertyI. C th l a ch n kh i t o b ng tn i t ng ho c ch b ng cc khai bo. N u nh b n khng c n dng n i t ng trong m i ch , b n khng c n ph i gn n cho m t bi n. N u m t i t ng c t o b ng cch kh i t o i t ng m c cao nh t, m i l n i t ng xu t hi n trong cc bi u th c, JavaScript s nh gi l i n m t l n. Ngoi ra, n u s d ng vi c kh i t o ny trong m t hm th m i l n g i hm, i t ng s c kh i t o m t l n Gi s b n c cu l nh sau:
if (condition) x={hi: there.}
Trong tr ng h p ny, JavaScript s t o ra m t i t ng v g n n vo bi n x n u bi u th c condition c nh gi l ng Cn v d sau t o ra m t i t ng myHonda v i 3 thu c tnh: myHonda={color:red,wheels:4,engine:{cylinder:4,size:2.2}} Ch r ng thu c tnh engine c ng l m t i t ng v i cc thu c tnh 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 php t o m ng b ng cch ny khc v i t o i t ng:
arrayName=[element0, element1,...,elementN]
Trong , arrayName l tn 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 cch s d ng Ph ng php kh i t o, th n s coi m i gi tr l m t ph n t trn m ng, v chi u di c a m ng chnh l s cc tham s .
Trang 77/109 B n khng c n ph i ch nh r t t c cc ph n t trn m ng m i. N u b n t hai d u ph y vo hng, 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 cch kh i t o(initializer) m c cao nh t, m i l n m ng xu t hi n trong cc bi u th c, JavaScript s nh gi l i n m t l n. Ngoi ra, n u s d ng vi c kh i t o ny trong m t hm th m i l n g i hm, m ng s c kh i t o m tl n V d 1: T o m t m ng coffees v i 3 ph n t v di 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
fish = [Lion, , Surgeon]
c kh i
u v m t ph n t r ng: c
V i bi u th c ny, fish[0] l Lion, fish[2] l Surgeon, v fish[2] cha nh ngh a 5.1.2. S D NG M T HM XY D NG(CONSTRUCTOR FUNCTION)
B n c th t o ra i t ng c a ring mnh v i hai b c sau: 1. nh ngh a ki u c a i t ng b ng cch vi t m t hm xy d ng. 2. T o ra m t c th c a i t ng b ng ton t new nh ngh a m t ki u i t ng, ta ph i t o ra m t hm ch nh r tn, cc thu c tnh v cc cch 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 tn l car, c cc thu c tnh make, model, year v color, th c hi n vi c ny c th vi t m t hm nh sau:
function car(make, model, year ){ this.make = make this.model = model this.year = year }
Ch vi c s d ng ton t this gn gi tr cho cc thu c tnh c a ph i thng qua cc tham s c a hm. 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)
it
ng
Cu l nh ny s t o ra i t ng mycar v lin k t cc gi tr c a vo v i cc thu c tnh. 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 nguyn 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 tnh m b n thn n c ng l m t i t ng. V d b n nh ngh a thm m t i t ng khc l person nh sau:
function person(name, age, sex){ this.name=name this.age=age this.sex=sex }
Trang 78/109 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)
By gi b n
nh ngh a l i hm xy 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
it
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 xu 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 cu l nh trn vo dng tham s c a i t ng m i t o. Ta c ng c th l y c thu c tnh c a i t ng owner b ng cu lnh sau:
car2.owner.name
Ch r ng b n c ng c th t o ra m t thu c tnh m i cho n, v d :

car1.color=black
it
ng tr
c khi
nh ngh a
Nh v y, thu c tnh color c a i t ng car1 c gn l black. Tuy nhin, n s khng gy tc ng t i b t k m t i t ng ki u car no khc. N u mu n thm thu c tnh cho t t c cc i t ng th ph i nh ngh a l i hm xy d ng i t ng. 5.1.3. L P M C L C CHO CC THU C TNH C A I T NG
Trong Navigator 2.0, b n c th g i thu c tnh c a m t i t ng b ng tn thu c tnh ho c b ng s th t c a n. Tuy nhin t Navigator 3.0 tr i, n u ban u b n nh ngh a m t thu c tnh b ng tn c a n, b n s lun lun ph i g i n b ng tn, v n u b n nh ngh a m t thu c tnh b ng ch s th b n c ng lun lun ph i g i t i n b ng ch s . i u ny ng d ng khi b n t o m t i t ng v i nh ng thu c tnh c a chng b ng hm xy 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 tnh c a ring m t i t ng (nh mycar.color=red). V v y n u b n nh ngh a cc thu c tnh 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 cc thu c tnh khc nh mycar[5]. Tuy nhin i u ny l khng 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 cc i t ng trong m ng b i s th t ho c tn c a chng. V d th <FORM> th hai trong m t document c thu c tnh 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
Trang 79/109 5.1.4. T NH NGH A THM CC THU C TNH CHO M T KI U NG I
B n c th thm thu c tnh cho m t ki u i t ng c nh ngh a tr c b ng cch s d ng thu c tnh property. Thu c tnh c nh ngh a ny khng ch c tc d ng i v i m t i t ng m c tc d ng i v i t t c cc i t ng khc cng ki u.V d sau th c hi n thm thu c tnh color cho t t c cc i t ng ki u car, sau g n m t gi tr mu cho thu c tnh color c a i t ng car1:
car.prototype.color=null car1.color=red
5.1.5.
NH NGH A CC CCH TH C
M t cch th c l m t hm c lin k t v i m t i t ng. B n nh ngh a m t cch th c c ng c ngh a l b n nh ngh a m t hm chu n. B n c th s d ng c php sau g n m t hm 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 tn cch th c v function_name l tn hm B n c th g i cch th c ny t i t ng nh sau:

object.methodname(<tham s >)
B n c th nh ngh a cch th c cho m t ki u i t ng b ng cch a cch th c vo trong hm xy d ng i t ng. V d b n c th nh ngh a m t hm c th nh d ng v hi n th cc thu c tnh c a cc i t ng ki u car xy d ng ph n tr c:
function displayCar () { var result = Abeautiful+this.year+ + this.make + + this.model document.write(result) }
B n c th thm cch th c ny vo cho sau vo hm nh ngh a i t ng

this.displayCar= displayCar;
it
ng car b ng cch thm dng l nh
Nh v y c th
nh ngh a l i
it
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 cch th c displayCar

car1.displayCar() car2.displayCar()
iv im i
it
ng:
Trang 80/109 5.1.6. S D NG CHO REFERENCES) CC THAM CHI U I T NG (OBJECT
JavaScript c m t t kho c bi t l this m b n c th s d ng n cng v i m t cch th c g i t i i t ng hi n th i. V d , gi s b n c m t hm validate dng xc nh n gi tr thu c tnh c a m t i t ng n m trong m t kho ng no : function validate(obj, lowval, hival){ if ( (obj.value<lowdate)||(obj.value>hival) ) alert(Invalid value!) } Sau b n c th g i hm validate t m i th s ki n onChange: <INPUT TYPE=TEXT NAME=AGE SIZE=3 onChange=validate(this,18,99) > Khi lin k t v i m t thu c tnh 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 nt b m. Khi ng i s d ng kch vo nt b m, tr ng text s hi n th tn form. Th s ki n onClick c a nt b m s d ng this.form g i t i form cha l myForm. <FORM NAME=myForm> Form name:<INPUT TYPE=text NAME=text1 VALUE=Beluga> <P> <INPUT TYPE=button NAME=button1 value=Show Form Name onClick=this.form.text1.value=this.form.name> </FORM> 5.1.7. XO I T NG
Trong JavaScript cho Navigator 2.0, b n khng th xo cc i t ng-chng v n t n t i trong khi b n r i kh i trang . Trong khi JavaScript cho Navigator 3.0 cho php b n c th xo m t i t ng b ng cch t cho n tr t i gi tr Null (n u nh l l n cu i cng g i t i i t ng). JavaScript s ng i t ng ngay l p t c thng qua bi u th c gn.
Trang 81/109
6.
B NG T NG K T CC T
KHO
c static super switch synchrinized this throw throws transient true try var void while with
Sau y l cc t oc s d ng l tn bi n: abstract boolean break byte case catch char class const continue default do double else
nh ngh a l m t ph n trong ngn ng JavaScript v khng eval extends false final finally float for function goto if implements import in instanceof int interface long native new null package parseFloat parseInt private protected public return short
Trang 82/109
7.
T NG K T
Nh v y, ti li u khng nh ng gi i thiu s qua v JavaScript, m n cn l sch tham kh o h t s c h u ch pht tri n ng d ng c a b n. B n c th tham kh o ton di n JavaScript trong quy n Teach Yourself JavaScript in 14 Days, ho c JavaScript Guide Do JavaScript l ngn ng cn m i v c s thay i nhanh chng, b n nn n v i trang Web c a hng Netscape ( http://www.netscape.com ) c cc thng tin m i nh t v ngn ng ny.
Khoa cng ngh
thng tin( HQG)
Trang 83/109
B
JAVASCRIPT Ton t Bi 1: T NG QUAN V p (bi 1)
SUNG
JAVASCRIPT.
1. c tnh c a ngn ng javascript: Javascript l m t ngn ng thng d ch (interpreter), ch ng trnh ngu n c a n c nhng (embedded) ho c tch h p (integated) vo t p tin HTML chu n. Khi file c load trong Browser (c support cho JavaScript), Browser s thng d ch cc Script v th c hi n cc cng vi c xc nh. Ch ng trnh ngu n JavaScript c thng d ch trong trang HTML sau khi ton b trang c load nh ng tr c khi trang c hi n th . Javascript l m t ngn ng c c tnh: n gi n. ng (Dynamic). H ng it ng (Object Oriented). 2. Ngn ng javascript: M t trong nh ng c tnh quan tr ng c a ngn ng JavaScript l kh n ng t o v s d ng cc i t ng (Object). Cc Object ny cho php ng i l p trnh s d ng pht tri n ng d ng. Trong JavaScript ,cc Object c nhn theo 2 kha c nh: a. Cc Object t n t i. b. Cc Object do ng i l p trnh xy d ng. Trong cc Object t n t i c chia thnh 2 ki u: a. Cc Object c a JavaScript (JavaScript Built-in Object). b. Cc it ng c cung c p b i mi tr ng Netscape. 3. Built-in Object trong javascript: JavaScript cung c p 1 b cc Built-in Object cung c p cc thng tin v s hi n hnh c a cc it ng c load trong trang Web v n i dung c a n.Cc i t ng ny bao g m cc ph ng php (Method) lm vi c v i cc thu c tnh (Properties) c a n. 4. Cc it ng c cung c p b i mi tr ng Netscape: Netscape Navigator cung c p cc it ng cho php JavaScript t
ng tc
Trang 84/109 i file HTML, cc i ng ny cho php chng ta i u khi n vi c hi n th thng tin v p ng cc s ki n trong mi tr ng Navigator.V d it ng M t Window Cung c p cc ph ng php v cc tnh ch t cho c a s hi n hnh c a trnh duy t,bao g m cc it ng cho m i frame. J JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 2 Location Cung c p cc tnh ch t v ph ng php lm vi c v i cc a ch URL hi n hnh cm . History Cc it ng history cung c p thng tin v cc danh sch c v c th gi i h n s t ng tc v i danh sch. Document y l m t it ng c s d ng nhi u nh t .N ch a ng cc it ng,tnh ch t v cc ph ng php lm vi c v i cc thnh ph n c a ti li u nh cc :form,link,anchor,applet. 5. Cc it ng do ng i l p trnh xy d ng: a. nh ngh a thu c tnh c a it ng: (Object Properties) C php : Object-name.Property-name (tn it ng.tn c tnh) V d :M t it ng airplane c cc thu c tnh nh sau: Airplane.model Airplane.price Airplane.seating Airplane.maxspeed Airplane.fuel b. Thm cc ph ng php cho it ng Method to Object) Sau khi c cc thng tin v airplane ta ti p t c xy d ng ph ng php s d ng thng tin ny.V d b n mu n in ra m t c a airplane ho c tnh ton kho ng cch t i a c a cu c hnh trnh v i nhin li u c: Airplane.description() Airplane.distance() c. T o m t instance c a it ng: Tr c khi thao tc v i m t it ng c a JavaScript ta ph i t o m t instance cho it ng . 6 . Nhng JavaScript vo trong t C php: <script> p tin HTML: v t
Trang 85/109 JavaScript Program </SCRIPT> Thu c tnh c a th SCRIPT + SRC : a ch URL ch n t p tin ch ng trnh JavaScript (*.js) + LANGUAGE: Ch nh ngn ng c s d ng trong Script v cc phin b n s d ng (v d nh :JavaScript ,JavaScript .1.2 vv ,VBScript). 7. n cc Scripts i v i cc Browser khng cung c p javascript: <script> <D> </SCRIPT> JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 3 8. S d ng t <script> <D> </SCRIPT> p tin JavaScript bn ngoi :
9. Thm ch ng trnh vo t p tin HTML: <HTML> <HEAD> <TITLE>Listing 2.1</TITLE> </HEAD> <BODY> Here is result: <script> <document> </SCRIPT> </BODY> </HTML> -----------------Kent(HCE) JAVASCRIPT Ton t Bi 2: S p (bi 2)
D NG JAVASCRIPT
1. C php c b n c a l nh : JavaScript xy d ng cc hm,cc pht bi u,cc ton t trn cng m t dng v k t thc b ng ; V d : document.writeln("It work<BR>");
v cc bi u th
Trang 86/109 2. Cc kh i l nh: Nhi u dng l nh c th c lin k V d : { document.writeln("Does It work"); document.writeln("It work!"); }
t v i nhau v
c bao b
i{}
3. Xu t d li u ra c a s trnh duy t: Dng 2 ph ng php document.write() v document.writeln() V d : document.write( Test ); document.writeln( Test ); 4. Xu t cc th HTML t JavaScript V d 1: <HTML> <HEAD> <TITLE>Outputting Text</TITLE> </HEAD> <BODY> This is text plain <BR> <script> </SCRIPT> </BODY> </HTML> V d 2: <HTML> <HEAD> <TITLE>Example 2.4 </TITLE> </HEAD> <BODY> <script> </H1> </SCRIPT> </BODY> </HTML> 5. S d ng ph <HTML> <HEAD> ng php writeln() v i th PRE:
Trang 87/109 <TITLE>Outputting Text</TITLE> </HEAD> <BODY>
<script>
<document>
</SCRIPT>
</BODY> </HTML> 6. Cc k t c bi t trong chu \n : New line \t : Tab \r : carriage return \f : form feed \b: backspace V d : document.writeln("It work!\n"); 7. Lm vi c v i cc dialog boxes S d ng hm alert() hi n th V d : <HTML> <HEAD> <TITLE>Example 2.5 </TITLE> </HEAD> <BODY> <script> <alert> </SCRIPT> </BODY> i:
thng bo trong m
th
p.
8. T ng tc v i ng i s d ng: S d ng ph ng php promt() t V d 1:
ng tc v
i ng
is
ng.
Trang 88/109 <HTML> <HEAD> <TITLE>Listing 2.6</TITLE> </HEAD> <BODY> <script> <document> </SCRIPT> </BODY> </HTML> V d 2: <HTML> <HEAD> <TITLE>Listing 2.6</TITLE> </HEAD> <BODY> <script> </H1> </SCRIPT> </BODY> </HTML> S d ng d u + c ng 2 chu V d 3: <HTML> <HEAD> <TITLE>Listing 2.6</TITLE> </HEAD> <BODY> <script> </H1> </SCRIPT> </BODY> </HTML> 9. Cc ki u d li u trong javascript: a. D li u ki u s : + S nguyn: v d 720 + S Octal: v d :056 + S Hexa:v d :0x5F + S th p phn :v d :7.24 , -34.2 ,2E3 b. D li u ki u chu i: v d : Hello
n l i:
Trang 89/109 245 c. D li u ki u Boolean: K t qu tr v l true ho c false. d. D li u ki u null: Tr v gi tr r ng. e. D li u ki u v n b n (gi ng nh
ki u chu
i)
10. T o bi n trong javascript: Var example; Var example= Hello ; Ta c th dng document.write(example); xu V d 1: dng t kha var khai bo bi n <HTML> <HEAD> <TITLE>Example 3.1</TITLE> <script> <var> </SCRIPT> </HEAD> <BODY> <script> </H1> </SCRIPT> </BODY> </HTML> V du 2: t o l i m t gi tr m i cho bi n <HTML> <HEAD> <TITLE>Example 3.2</TITLE> <script> var name=prompt("enter your name:","name"); alert ("greeting " + name + " , "); name=prompt("enter your friend's name:","friend's name"); </SCRIPT> </HEAD> <BODY> <script> </H1> </SCRIPT>
tn
i dung c a bi n.
Trang 90/109 </BODY> </HTML> 11. Lm vi c v i bi n v bi u th c: Thi t l p bi u th c: C php: <bi> <to> <bi> * Ton t : = Thi t l p gi tr bn ph i cho bn tri V d Mad=5 += C ng tri v ph i ,sau gn k t qu cho bn tri php ton V d : cho x=10,y=5 x+=y => x=15 -= Tr bn tri cho bn ph i ,gn k t qu l i cho bn tri x-=y => x=5 *= Nhn bn tri cho bn ph i,gn k t qu cho bn tri x*=y => x=50 /= Chia bn tri cho ph i ,gn k t qu l i cho bn tri x/=y => x=2 %= Chia bn tri cho bn ph i v l y s d gn l i cho bn tri x%=y => x=0 * Cc ton t khc: V d : x+=15+3 => x=18 8+5 32.5 * 72.3 12 % 5 D u ++ v d u - - v d u V d : x=5; y=++x; (=> y=6 v x t ng ln 6) z=x++; (=> z=6 v sau x gn cho z) sau x t ng 1 => x=7 Do ta c k t qu cu i cng l: x=7;y=6;z=6; V d : x=5; x=-x => x=-5 Php ton Logic && : v ||: ho c ! not V d : x=5 ,y=2 ,c=3 (x>y) && (x>c)
Trang 91/109 false && anything is always false (x>y) || (c<x> true !x Ton t so snh trong javascript: == != > < >= <V> true 3<1>false 5 >=4 =>true the != he => true 4== 4 =>true Ton t i u ki n: C php: ( i u ki n ) ? gi tr 1 : gi tr 2 N u i u ki n ng th tr v gi tr 1 N u i u ki n sai th tr v gi tr 2 V d : (day= Saturday ) ? Weekend : Not Saturday Ton t chu i: Welcome to + Netscape Navigator V d : Var welcome= Welcome to Welcome += Netscape Navigator ! welcome= Welcome to Netsacpe Navigator V d : S d ng ton t i u ki n ki m tra ng <HTML> <HEAD> <TITLE>Example 3.3</TITLE> <script> var question="What is 10+10 ?"; var answer=20; var correct=''; var incorrect=''; var response=prompt(question,"0"); var output = (response==answer) ? correct:incorrect; </SCRIPT> </HEAD> <BODY> <script> <document>
vo
Trang 92/109 </SCRIPT> </BODY> </HTML> 12. C u trc i u ki n if else if i u ki n l nh ; if i u ki n { M JavaScript } V d : if (day== Saturday ) { document.writeln( It s the weekend ); alert( It s the weekend ); } V d : If (day== Saturday ) { document.writeln( It s the weekend ); } If (day!= Saturday ) { document.writeln( It s not Saturday ); } S d ng c u trc else if cho v d If (day== Saturday ) { document.writeln( It s the weekend ); } else { document.writeln( It s not Saturday ); } C u trc k t h p : if i u ki n 1 { Cc l nh JavaScript if i u ki n 2 { Cc l nh JavaScript } else { cc l nh khc } Cc l nh JavaScript } else { Cc l nh khc } V d 1 : S d ng ph <HTML>
trn
ng php confirm() v
i pht bi u if
Trang 93/109 <HEAD> <TITLE>Example 3.3</TITLE> <script> var question="What is 10+10 ?"; var answer=20; var correct=''; var incorrect=''; var response=prompt(question,"0"); if (response != answer) { if (confirm("Wrong ! press OK for a second change")) response=prompt(question,"0"); } var output = (response ==answer ) ? correct:incorrect ; </SCRIPT> </HEAD> <BODY> <script> <document> </SCRIPT> </BODY> </HTML> V d 2 : S d ng ph ng php confirm() v <HTML> <HEAD> <TITLE>Example 3.3</TITLE> <script> var question="What is 10+10 ?"; var answer=20; var correct=''; var incorrect=''; var response=prompt(question,"0"); if (response != answer) { if (confirm("Wrong ! press OK for a second change")) response=prompt(question,"0"); }else { if (confirm("Correct ! press OK for a second question")) { question="What is 10*10"; answer=100; response=prompt(question,"0");
i pht bi u if - else
Trang 94/109 } } var output = (response ==answer ) ? correct:incorrect ; </SCRIPT> </HEAD> <BODY> <script> <document> </SCRIPT> </BODY> </HTML> ------------------Kent(HCE)
JAVASCRIPT Ton t BI 3: HM V
p (bi 3) NG
IT
Trong k thu t l p trnh cc l p trnh vin th ng s d ng hm th c hi n m t o n ch ng trnh th hi n cho m t module no th c hi n m t cng vi c no . Trong Javascript c cc hm c xy d ng s n gip b n th c hi n m t ch c n ng no v d nh hm alert(), document.write(), parseInt() v b n c ng c th nh ngh a ra cc hm khc c a mnh th c hi n m t cng vi c no c a b n, nh ngh a hm b n theo c php sau: function function_name(parameters, arguments) { command block } Truy n tham s : function printName(name) { document.write( <HR>Your Name is ); document.write(name); document.write( <HR> ); } V d : G i hm printName()v i l nh sau printName( Bob ); Khi hm printName() c thi hnh gi tr c a name l "Bob" n u g i hm
Trang 95/109 printName()v i i s l m t bi n var user = John ; printName(user); Khi name l John . N u b n mu n thay i gi tr th lm nh sau : name = Mr. + name; Ph m vi c a bi n: Bi n ton c c (Global variable) Bi n c c b (Local variable) Tr v cc gi tr : V d : Dng return tr v gi tr c a bi n cube. MTWRFSS function cube(number) { var cube = number * number * number; return cube; } JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 11 V d : MTWRFSS <HTML> <HEAD> <TITLE>Example 4.1</TITLE> <script> <!-- HIDE FROM OTHER BROWSERS //DEFINE FUNCTION testQuestion() function testQuestion(question) { //DEFINE LOCAL VARIABLES FOR THE FUNCTION var answer=eval(question); var output= What is + question + ? ; var correct= ; var incorrect= ; //ASK THE QUESTION var response=prompt(output, 0"); //CHECK THE RESULT return (response == answer) ? correct : incorrect; } // STOP HIDING FROM OTHER BROWSERS -> </SCRIPT> </HEAD<
c a name b
n c
Trang 96/109 <BODY> <script> <HIDE> </SCRIPT> </BODY> </HTML> Hm eval dng chuy n i gi tr chu i s eval( 10*10 )tr v gi tr l 100 Hm g i l i hm: V d : <HTML> <HEAD> <TITLE>Example 4.2</TITLE> <script> <!-- HIDE FROM OTHER BROWSERS //DEFINE FUNCTION testQuestion() function testQuestion(question) { //DEFINE LOCAL VARIABLES FOR THE FUNCTION var answer=eval(question); var output= What is + question + ? ; var correct= ; var incorrect= ; //ASK THE QUESTION var response=prompt(output, 0"); //CHECK THE RESULT return (response == answer) ? correct : testQuestion(question); } // STOP HIDING FROM OTHER BROWSERS -> </SCRIPT> </HEAD< <BODY> <script> <HIDE> </SCRIPT> </BODY> </HTML> V d 2: <HTML> <HEAD> <TITLE>Example 4.2</TITLE>
thnh gi tr
Trang 97/109 <script> <!-- HIDE FROM OTHER BROWSERS //DEFINE FUNCTION testQuestion() function testQuestion(question,chances) { //DEFINE LOCAL VARIABLES FOR THE FUNCTION var answer=eval(question); var output= What is + question + ? ; var correct= ; JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 12 var incorrect= ; 4 //ASK THE QUESTION var response=prompt(output, 0"); //CHECK THE RESULT if (chances > 1) { return (response == answer) ? correct : testQuestion(question,chances-1); } else { return (response == answer) ? correct : incorrect; } } // STOP HIDING FROM OTHER BROWSERS -> </SCRIPT> </HEAD> <BODY> <script> <HIDE> </SCRIPT> </BODY> </HTML> ------------------Kent(HCE) JAVASCRIPT Ton t Bi 4: T 1. O IT p (bi 4) NG TRONG JAVASCRIPT c tnh c a it ng:
nh ngh a thu
Trang 98/109 function student(name,age, grade) { this.name = name; this.age = age; this.grade = grade; } t o m t Object ta s d ng pht bi u new.V d t o it ng student1 student1 = new student( Bob ,10,75); 3 thu c tnh c a it ng student1 l : student1.name student1.age student1.grade V d t o it ng student2 student2 = new student( Jane ,9,82); thm thu c tnh cho student1 b n c th lm nh sau: student1.mother = Susan ; ho c b n c th nh ngh a l i hm student MTWRFSS 4 function student(name, age, grade, mother) { this.name = name; this.age = age; this.grade = grade; this.mother = mother; } JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 13 it ng l thu c tnh c a it ng khc V d : function grade (math, english, science) { this.math = math; this.english = english; this.science = science; } bobGrade = new grade(75,80,77); janeGrade = new grade(82,88,75); student1 = new student( Bob ,10,bobGrade); student2 = new student( Jane ,9,janeGrade); student1.grade.math:dng l y i m Ton c a student1 student2.grade.science: dng l y i m mn Khoa h c c a student2 2. Thm ph ng php cho it ng: function displayProfile() { document.write( Name: + this.name + <BR> ); document.write( Age: + this.age + <BR> ); document.write( Mother s Name: + this.mother + <BR> ); document.write( Math Grade: + this.grade.math + <BR> ); document.write( English Grade: + this.grade.english + <BR> );
Trang 99/109 document.write( Science Grade: + this.grade.science + <BR> ); } function student(name,age, grade) { this.name = name; this.age = age; this.grade = grade; this.mother = mother; this.displayProfile = displayProfile; } student1.displayProfile(); V du: 4 <HTML> <HEAD> <TITLE>Example 4.3</TITLE> <script> <!-- HIDE FROM OTHER BROWSERS //DEFINE METHOD function displayInfo() { document.write( <H1>Employee Profile: + this.name + </H1><HR> );
document.writeln( Employee Number:
+ this.number);
JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 14
document.writeln( Social Security
Number:
+ this.socsec);
document.writeln( Annual Salary:
this.salary);
Trang 100/109
document.write( ); } //DEFINE OBJECT function employee() { this.name=prompt( Enter Employee s Name , Name ); this.number=prompt( Enter Employee Number for + this.name, 000-000"); this.socsec=prompt( Enter Social Security Number for + this.name, 000-00-0000"); this.salary=prompt( Enter Annual Salary for + this.name, $00,000"); this.displayInfo=displayInfo; } newEmployee=new employee(); // STOP HIDING FROM OTHER BROWSERS -> </SCRIPT> </HEAD> <BODY> <script> <HIDE> </SCRIPT> </BODY> </HTML> Vi du: <script> <Begin> 12) ? myhours 12 : myhours; ampm = (myhours >= 12) ? 'Bu i Chi u ' : ' Bu i S ng '; mytime = mydate.getMinutes(); myminutes = ((mytime <10> </script> Trong ph n body b n c th xu t ra d ng nh sau: <body> <script> document.write("<font>" + ampmhour + "" + myminutes + ampm) document.write(" - " + day + " ng y " + myweekday +" ");
Trang 101/109 document.write( month + " , n m " + year + "</font>"); </script> </body> ------------------Kent(HCE) JAVASCRIPT Ton t Bi 5: S p (bi 5)
KI N TRONG JAVASCRIPT
Cc s ki n cung c p cc t ng tc v i c a s trnh duy t v ti li u hi n hnh ang c load trong trang web, cc hnh ng c a user khi nh p d li u vo form v khi click vo cc button trong form. Khi s d ng b qu n l s ki n b n c th vi t cc hm bi u di n cho cc hnh ng d a vo cc s ki n oc ch n B ng s ki n trong Javascript JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 16 Tn s ki n M t blur Xy ra khi i m t p trungc a ng vo c di chuy n ra kh i m t thnh ph n c a Form (Khi user click ra ngoi m t tr ng) click Khi user Click vo 1 link ho c thnh ph n c a Form. change Xy ra khi gi tr c a Form Field b thay i b i user. focus Xy ra khi ng vo t p trung vo thnh ph n c a Form load Xy ra khi m t trang c Load vo trong b duy t. mouseover Xy ra khi User di chuy n mouse qua m t Hyperlink. select Xy ra khi User ch n 1 tr ng c a thnh ph n Form. submit Xy ra khi User xc nh n nh p xong d li u. unload Xy ra khi User r i kh i trang Web. B qu n l s ki n (Event Handler) qu n l cc s ki n trong javascript ta dng cc b qu n l s ki n. C php c a m t b qu n l s ki n: <HTML_TAG> V d : <INPUT> V d : <INPUT TYPE= text onChange= if (parseInt(this.value) <5> V d :
Trang 102/109 <INPUT> T kha this: quy cho it ng hi n hnh.Trong Javascript Form l m it ng.Cc thnh ph n c a Form bao g m text fields, checkboxes, radio buttons, buttons, v selection lists. V d : <INPUT> Cc b qu n l s ki n trong Javascript it ng B qu n l s ki n t ng ng. JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 17 Selection list onBlur, onChange, onFocus Text element onBlur, onChange, onFocus, onSelect Textarea element onBlur, onChange, onFocus, onSelect Button element OnClick Checkbox onClick Radio button OnClick Hypertext link onClick, onMouseOver Reset button OnClick Submit button OnClick Document onLoad, onUnload Window onLoad, onUnload Form onSubmit 5 Cch dng b qu n l s ki n onLoad & onUnload <HTML> <HEAD> <TITLE>Example 5.1</TITLE> </HEAD> <BODY> </BODY> </HTML> MTWRFSS Vi du: <HTML> <HEAD> <TITLE>Example 5.1</TITLE> <script> <HIDE> </SCRIPT> </HEAD> <BODY> </BODY>
Trang 103/109 </HTML> Vi du MTWRFSS <HTML> <HEAD> JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 18 <TITLE>Example 5.1</TITLE> <script> <HIDE> </SCRIPT> </HEAD> <BODY> </BODY> </HTML> Cc s ki n v Form Cac s ki n c s d ng truy xu t Form nh : OnClick, onSubmit, onFocus, onBlur, v onChange. V d : <INPUT> Khi gi tr thay i function check() s c g i. Ta dng t kha this chuy n it ng c a tr ng hi n hnh n hm check() B n c ng c th d a vo cc ph ng php v cc thu c tnh c a i t ng b ng pht bi u sau: this.methodName() & this.propertyName. V d : <HTML> <HEAD> <TITLE>Example 5.3</TITLE> <script> <HIDE> </SCRIPT> </HEAD> <BODY> <FORM> Enter a JavaScript mathematical expression: <INPUT> <BR> JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 19 The result of this expression is: <INPUT> </FORM>
Trang 104/109 </BODY> </HTML> MTWRFSS formObjectName.fieldnameng ch tn tr ng c a hi n hnh trong Form. formObjectName.fieldname.value: dng l y gi tr c a tr ng form hi n hnh. S d ng vng l p trong JavaScript 1 . Vng l p for : C php : for ( init value ; condition ; update expression ) V d : for (i = 0 ; i < 5 ; i++) { l nh ; } V d : <HTML> <HEAD> <TITLE> for loop Examle </TITLE> </HEAD> <BODY> <script> <!- var name=prompt("What is your name?" ,"name"); var query= " " ; document.write("<H1>" + name + " 's 10 favorite foods </H1> "); for (var i=1 ;i<10> </SCRIPT> </BODY> </HTML> 2 . Vng l p while : C php: While ( i u ki n) { l nh JavaScript ; } V d : var num=1; while(num<=10) { document.writeln(num); num++; }
Trang 105/109 V d : var answer= ; var correc=100; var question= what is 10*10 ? ; while(answer!=correct) { answer=prompt(question, 0 ); } 3. T o m ng v i vng l p for: function createArray(num) { this.length=num; for ( var j=0 ; j<num; j++) this[j]=0; } Hm s t o m t m ng c gi tr index b t u l 0 v gn t t c cc gi tr c a m ng v 0 . s d ng it ng m ng ta c th lm nh sau: newArray= new createArray(4) S t o ra m t m ng g m 4 thnh ph n newArray[0] NewArray[3] JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 21 S d ng it ng Windows Window l it ng c a mi tr ng Navigator,ngoi cc thu c tnh Window it ng window cn gi cc it ng khc m c th c xem nh l cc thnh ph n (member) c a window, cc it ng l: Cc frame ct o Cc it ng location v histtory it ng document it ng document ch a (encompasses) t t c cc thnh ph n trong trang HTML. y l m t i t ng hon h o c cc it ng khc c a JavaScript gn (attached) vo n (nh l anchor,form,history,link).H u nh m i ch ng trnh JavaScript u c s d ng it ng ny tham kh o n cc thnh ph n trong trang HTML. 1) Cc thu c tnh (properties) c a it ng document a . alink b . anchor c . bgColor d . cookies e . fgColor f . form
Trang 106/109 g . lastModified h . linkColor i . links j . location k . referrer l . title m . vlinkColor 2) Cc hnh vi (Methods) c a it ng document a . clear() b . close() c . open() d . write() e . writeln() 3) Cc thu c tnh c a it ng Window a . defaultStatus : Gi tr m t nhin c hi n th thanh tr ng thi b . frames : M ng cc it ng ch a ng m t m c cho m i frame con trong m t frame ti li u c . parent : c s d ng trong FRAMSET d . self : C a s hi n hnh , dng phn bi t gi a cc c a s hi n hnh v cc forms c cng tn . e . status : Gi tr c a chu i v n b n c hi n th t i thanh status bar.Dng hi n thi cc thng bo cho ng i s d ng . f . top : nh cao nh t c a c a s cha JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 22 g . window 4) Cc hnh vi (Methods) c a it ng window a . alert() : Hi n 1 thng bo trong h p tho i v i OK button. b . close() : ng c a s hi n hnh. c . open() : M m t c a s m i v i 1 ti li u c ch ra ho c m m t ti li u trong m t tn c a s c ch nh. d . prompt() : Hi n m t h p thng bo e . setTimeout() : f . clearTimeout() : Hnh vi ny cung c p cch g i pht bi u JavaScript sau m t kho ng th i gian tri qua .Ngoi ra it ng window c th th c hi n event handler : onLoad=statement Lm vi c v i status bar Khi user di chuy n qua m t hyperlink ta c th hi n ra m t thng bo t i thanh status bar c a bowser d a vo event handler onMouseOver v b ng cch t self.status l m t chu i (ho c
Trang 107/109 window.status). V d : <HTML> <HEAD> <TITLE>Status Example</TITLE> <BODY> <A>Lop chuyen d PLC </A> <A>Thiet Ke Web</A> </BODY> </HTML> M v ng cc c a s S d ng ph ng php open() v close() ta c th i u khi n vi c m v ng c a s ch a ti li u. open ( URL , WindowName , featureList ) ; Cc c i m trong ph ng php open() g m c: toolbar : t o m t toolbar chu n location: t o m t vng location directories: t o cc button th m c chu n status: t o thanh tr ng thi. menubar : t o thanh menu t i nh c a c a s scrollbars: t o thanh scroll bar resizable: cho php user thay i kch th cc as width : ch nh chi u r ng c a s theo n v pixel height : ch nh chi u cao c a s theo n v pixel V d : window.open( plc.htm , newWindow , toolbar=yes,locat ion=1,directories=yes,status=yes, JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 23 menubar=1,scroolbar=yes,resizable=0,copyhistory=1, width=200,height=200 ); V d : <HTML> <HEAD> <TITLE>WINDOWS</TITLE> <script> <function> </SCRIPT> </HEAD> <BODY> <a>PLC</a>, <a>Sua chua</a>, <a>Thiet ke web</a> </BODY> </HTML>
Trang 108/109 ng c a s ta c th dng ph ng php close() V d : <HTML> <HEAD> <TITLE>Close Example</TITLE> </HEAD> <BODY> <A></A> <A>Close This Sample</A> </BODY> </HTML> S d ng it ng string String l m t it ng c a JavaScript,khi dng it ng string chng ta khng c n cc pht bi u t o m t instance (th nghi m) c a it ng ,b t k lc no ta t text gi a hai d u ngo c kp v gn n n m t bi n ho c m t thu c tnh th ta t o m t it ng string. 1. Cc thu c tnh c a it ng string Thu c tnh length gi s k t c a string. 2. Cc hnh vi (Methods) c a it ng string a . Anchor (nameAttribute) b . big() c . blink() d . bold() e . charAt(index) f . fixed() g . fontcolor(color) JAVASCRIPT MEDIASPACE CLUB (HTD) PAGE: 24 h . fontsize(size) i . indexOf(character,[fromIndex]) j . italics() k . lastIndexOf(character,[fromIndex]) l . link(URL) m . small() n . strike() o . sub() p . substring(startIndex,endIndex) q . sup() r . toLowerCase() s . toUpperCase()
uT m
Trang 109/109
------------------Kent(HCE)

Giao Trinh Javascript Hay

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Giao Trinh Javascript Hay

Uploaded by

Copyright:

Available Formats

Trang 1/109

Gio trnh JavaScript ***

<SCRIPT LANGUAGE=JavaScript> // INSERT ALL JavaScript HERE </SCRIPT>

Thu c tnh SRC c th tuy t i, v d :

<SCRIPT SRC=" http://cse.com.vn ">

type=application/x-javascript c ui .js t i ki u MIME application/x-javascript , Navigator

Hnh 2.3: Minh ho th NOSCRIPT 2.3. HI N TH M T DNG TEXT

V d : Cch th c write() xu t ra th HTML

V d : S khc nhau c a write() v writeln():

Hnh 2.5: S khc nhau c a write() v writeln() 2.4. GIAO TI P V I NG I S D NG

Hnh 2.2: Hi n th l i cho ng

Trang 13/109 By gi b n c t ng v cc ch c n ng c th ti p t c tm hi u thm v chnh ngn ng ny. 2.5. I M L I CC L NH V M

c qua JavaScript, chng ta hy

L NH/M SCRIPT SRC

// /*...*/ document.write() document.writeln() alert()

Hi n th m t dng thng bo trong h p h i tho i ng th i cung c p m t tr ng nh p d li u ng i s d ng nh p vo.

TRONG JAVASCRIPT ng trnh khng thay i. Sau y

</HTML> Cc trnh duy t h tr JavaScript s x l chnh xc v d trn v y: a ra k t qu d i

M t literal c ki u d u ph y ng c 4 thnh ph n sau: y Ph n nguyn th p phn. y D u ch m th p phn (.). y Ph n d . y Ph n m .

Trang 16/109 phn bi t ki u d u ph y d u ch m hay E. V d :

ng v i ki u s nguyn, ph i c t nh t m t ch s theo sau

1.1.3. KI U LOGIC (BOOLEAN) Ki u logic c s d ng ch c hai gi tr y true. y false. ch hai i u ki n : ng ho c sai. Mi n gi tr c a ki u ny

c bi u di n b i khng hay nhi u k t

bi u di n d u nhy kp ( " ), trong chu i s d ng ( \" ), v d :

N u i u ki n condition c nh gi l ng, bi u th c nh n gi tr valTrue, ng c l i nh n gi tr valFalse. V d :

Trong v d ny bi n state c gn gi tr "liquid" n u gi tr c a bi n temp l n h n 32; trong tr ng h p ng c l i n nh n gi tr "solid".

== != > >= < <= 2.1.3. S

Tr l i gi tr ng n u ton h ng bn tri l n h n ho c b ng ton h ng bn ph i Tr l i gi tr ph i ng n u ton h ng bn tri nh h n ton h ng bn

Tr l i gi tr ng n u ton h ng bn tri nh h n ho c b ng ton h ng bn ph i H C ng, JavaScript cn h

L ton t logic AND, tr l i gi tr expr1 v expr2 cng ng.

Trang 22/109 y y for loop while loop

Trang 23/109 Hnh 5.1: K t qu c a l nh for...loop

V d ny lu vo file for_loop.Html. Vng l p ny s th c hi n kh i m l nh cho 3.1.2. WHILE

V d V d sau s l y ra t t c cc thu c tnh c a tnh. K t qu c minh ho trn hnh 5.2.

Hnh 5.2: K t qu c a l nh for...in

Trang 26/109 3.1.6. NEW Bi n new c th c hi n C php t o ra m t th hi n m i c a m t it ng

objectvar = new object_type ( param1 [,param2]... [,paramN])

Hnh 5.3: K t qu c a v d l nh New

3.1.7. THIS T kho this c s d ng ch i t ng hi n th i. t ng hi n th i trong Ph ng th c ho c trong hm. C php

V d : V d sau ch ra cch s d ng l nh with thi t l p i t ng ng m nh l document v c th s d ng Ph ng th c write m khng c n c p n i t ng document

Hnh 5.4: K t qu c a v d l nh with

V d : V d sau minh ho cch th c t o ra v s d ng hm nh l thnh vin c a m t Hm printStats c t o ra l Ph ng th c c a i t ng person

Hnh 5.6 V d hm Eval

N t o ra m t m ng v i kch th c xc nh tr c v i n cc gi tr 0. Ch r ng thnh ph n u tin trong m ng l di m ng v khng c s d ng. t o ra m t m ng, khai bo nh sau:

N t o ra cc thnh ph n t myArray[1] n myArray[10] v i gi tr l 0. Gi tr cc thnh ph n trong m ng c th c thay i nh sau:

t o n m hay m t hm c th c hi n ph n ng tr c m t s ki n g i l Ch ng trnh x l s ki n. Ch ng trnh x l s ki n c xc nh l m t thu c tnh c a m t th HTML:

ng trnh x l s ki n (Event handler): M

V d sau g i hm CheckAge() m i khi gi tr c a tr

<INPUT TYPE=TEXT NAME="AGE" onChange="CheckAge()">

Trang 36/109 k t c a form.

X y ra khi gi tr c a thnh ph n X y ra khi thnh ph n c a form X y ra trang Web c t i.

i b <INPUT TYPE=CHECKBOX NAME="HOAT_DONG" VALUE="Di bo">

Hnh 5.10: Minh ho cho v d Event Handler

m ph ng cc vng l p for sau:

1. S d ng cch th c confirm() v c u trc if...then:

sau s minh ho s phn c p c a cc

V d V d sau s hi n th cc thu c tnh c a

Hnh 6.2: Minh ho cho

Trang 47/109 4.1.2. CC PH NG TH C

Hnh 6.3: Minh ho cho 4.1.3. CC CH NG TRNH X L S

onLoad - Xu t hi n khi c a s k t thc vi c t i. onUnLoad - Xu t hi n khi c a s c lo i b .

t o m t frame, ta s d ng th FRAMESET. M c ch c a th ny l t p cc frame trong m t trang. V d 1: t o frame ( hnh 17)

Trong file muske13.html l i ti p t c

// /.../ document.write() document.writeln() alert()