You are on page 1of 29

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

Chng 01

TNG QUAN V JAVASCRIPT


Gii Thiu Nhng JavaScript vo trang Web Cc lnh c bn I. Gii thiu Vi HTML s cho ta bit cch to ra trang Web - tuy nhin ch mi mc biu din thng tin ch cha phi l cc trang Web ng c kh nng p ng cc s kin t pha ngi dng. Hng Netscape a ra ngn ng script c tn l LiveScript thc hin chc nng ny. Sau ngn ng ny c i tn thnh JavaScript tn dng tnh i chng ca ngn ng lp trnh Java. Mc d c nhng im tng ng gia Java v JavaScript, nhng chng vn l hai ngn ng ring bit. JavaScript l ngn ng di dng script c th gn vi cc file HTML. N khng c bin dch m c trnh duyt din dch, trnh duyt c JavaScript di dng m ngun. Chnh v vy ta c th d dng hc JavaScript trn cc trang Web c s dng JavaScript. JavaScript l ngn ng da trn i tng, ngha l bao gm nhiu kiu i tng, v d i tng Math vi tt c cc chc nng ton hc. Tuy vy JavaScript khng l ngn ng hng i tng nh C++ hay Java do khng h tr cc lp hay tnh tha k. II. Nhng JavaScript vo File HTML S dng mt trong cc cch sau: S dng cc cu lnh v cc hm trong cp th <SCRIPT> S dng cc File ngun JavaScript S dng mt biu thc JavaScript lm gi tr ca mt thuc tnh HTML S dng th s kin (event handlers) trong mt th HTML no

Trong , s dng cp th <SCRIPT>...</SCRIPT> v nhng mt File ngun JavaScript l c s dng nhiu hn c. 1. Nhng JavaScript vo trang HTML JavaScript c a vo File HTML bng cch s dng cp th <Script> v </Script>. Nu t trong phn <Head>, n s c ti v sn sng trc khi phn cn li ca vn bn c ti.S dng c php sau : <Script > // Chn cc m Javacript vo y </Script>

V d: To trang web (Clock1.htm) s dng nhng m JavaScript trc tip vo trang Ghi ch: C th su tm cc m JavaScript t Website http://www.javascriptbank.com.vn, www.echip.com.vn
Bin san: Dng Thnh Pht Trang 31

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

2. S dng File ngun JavaScript Dng phng php ny hay hn nhng trc tip lnh JavaScript vo trang HTML. C php: <Script Src="File_name.js"> </Script> V d: <Script Src=" Clock2.js "> Cc File JavaScript bn ngoi ch cha cc cu lnh JavaScript v nh ngha hm. Tn File ca cc hm JavaScript bn ngoi cn c ui .js, V d: To trang web(Clock.htm) s dng nhng m JavaScript thng qua 1 tp tin Javascript . III. Cc lnh c bn 1. C php c bn ca lnh : JavaScript xy dng cc hm, cc pht biu, cc ton t v cc biu thc trn cng mt dng v kt thc bng ; Cch gi mt phng thc ca mt i tng nh sau: object_name.property_name; V D: document.write("Cho cc bn!<BR>"); 2. Hin th mt dng vn bn i tng document trong JavaScript c thit k sn hai phng thc xut mt dng vn bn ra mn hnh client: write() v writeln(). document.write(Chui vn bn); V d: document.write("Cho cc bn"); document.writeln(Chc cc bn vui v!); Phng thc write(): Xut ra mn hnh dng vn bn nhng khng xung dng Phng thc writeln(): Sau khi vit xong dng vn bn t ng xung dng. Ghi ch: C th dng + ghp nhiu chui k t. Cho php dng cc k t c bit trong chui: \n : Xung dng \t : Tab Khi c dng cc k t c bit hoc lnh Writeln th phi t khi JavaScript trong cp th <Pre> . . </Pre> (Th quy nh vn bn nh dng trc) V d: To trang (OutputText.htm) phn bit s khc nhau ca write() v writeln():
<Body> <PRE> <Script Language="JavaScript"> document.writeln("One,"); document.write("Two,\n"); document.write("Three "); document.write("..."); </Script> </PRE> <Body>

Bin san: Dng Thnh Pht

Trang 32

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

3. Hin th hp thoi thng bo Lnh alert() C php: alert("Cu thng bo"); Khi s ch cho n khi ngi s dng nhn vo nt OK . Thng thng, cch thc alert() c s dng trong cc trng hp: Thng tin a vo form khng hp l Kt qu sau khi tnh ton khng hp l Khi dch v cha sn sng truy nhp d liu
<Body> <Script Language="JavaScript"> alert("Cho mng bn n vi JavaScript!. \n Nhn Ok tip tc"); </Script> Chc bn thnh cng!!! </Body>

V d: To trang (Thongbao.htm)

4. Giao tip vi ngi s dng Lnh prompt() Mt hp thoi gm 1 dng thng bo, 1 trng nhp d liu, 1 nt OK v 1 nt Cancel. Ngi s dng nhp vo trng ri kch vo OK. Khi , ta c th x l d liu va a vo. C php: window.prompt("Cu thng bo",ni dung mc nh); V d: To trang (Hello.htm) hin th hp thoi hi tn ngi dng v sau s hin th mt thng bo cho tn mi a vo.
<Body> <Script Language="JavaScript"> var name=window.prompt("Xin cho!Bn tn g?",""); document.write("Xin cho bn " + name + " ! Chc bn hc tt JavaScript "); </Script> </Body>

Bin san: Dng Thnh Pht

Trang 33

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

5. Hi p ngi s dng Lnh confirm() Lnh confirm() to ra 1 hp thoi gm 1 dng thng bo, nt OK v nt Cancel. Ngi s dng c th click vo OK. Khi s x l thc hin hnh ng theo yu cu, ngc li khi Click vo Cancel s b ng hp thai thng bao. Thng s dng trong cc trng hi p, xc nhn quyt nh x l thng tin t pha ngi dng C php: confirm("Cu thng bo hi ?"); V d: To trang (HoiDap.htm) nh sau.
<script> function Hoidap(){ question = confirm("Bn tht s mun truy cp Website") if (question !="0"){ top.location = "http://www.tuoitre.com.vn/" } } </script> Hy click vo y truy cp website:<a href=""onClick="Hoidap();return false;">Bo Tui Tr </a>

Bin san: Dng Thnh Pht

Trang 34

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

Chng 02

NGN NG KCH BN JAVASCRIPT


Bin v khai bo bin Kiu d liu Lnh, khi lnh Ton t v biu thc Cu trc lp trnh Mng Hm I. Bin Cng nh cc ngn ng lp trnh khc javascript dng bin lu tr cc gi tr nhp vo, cc gi tr tnh ton . . .Ni cch khc bin l vng nh s dng lu tr cc gi tr khc nhau trong qu trnh chng trnh hot ng. Mi bin c mt tn, Tn bin trong JavaScript phi bt u bng k t . Phm vi ca bin c th l mt trong hai kiu sau: Bin ton cc: C th c truy cp t bt k u trong ng dng. c khai bo: x = 0; Bin cc b: Ch c truy cp trong phm vi chng trnh m n khai bo. Bin cc b c khai bo trong mt hm vi t kho var: var x = 0;

II. Kiu d liu Khc vi C++ hay Java, JavaScript l ngn ng c tnh nh kiu thp. Ngha l khng phi ch ra kiu d liu cho bin. Kiu d liu c t ng chuyn thnh kiu ph hp khi cn. V d: To trang (DataType.htm) nh sau
<HTML> <Body> <Script Language= "JavaScript"> var a='Tri to'; var n=12; n = n + 20; var tb ="C tt c " + n + " " + a; document.write(tb); </Script> </Body> </HTML>

Trong JavaScript, c bn kiu d liu sau y: 1. KIu nguyn (Interger) S nguyn c th c biu din theo ba cch: H c s 10 (h thp phn), H c s 8 (h bt phn) v H c s 16 (h thp lc phn) -Vi hai ch s u tin l 0x. (V D: 0x5F) 2. Kiu du phy ng (Floating Point) Mt bin c kiu du phy ng c 4 thnh phn sau: Phn nguyn thp phn. Du chm thp phn (.). Phn d. Phn m. V d: 9.87 hay -0.85E4
Trang 35

Bin san: Dng Thnh Pht

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

3. Kiu logic (Boolean) Kiu logic c s dng ch hai iu kin : ng hoc sai. Min gi tr ca kiu ny ch c hai gi tr : true , false. 4. Kiu chui (String) Mt bin kiu chui biu din bi khng hay nhiu k t t trong cp du " ... " hay '... ' V d: The dog ran up the tree hay 100 Ghi ch: biu din du nhy kp ( " ), trong chui s dng ( \" ), V d: document.write( \This text inside quotes.\ ); III. Lnh, khi lnh trong JavaScript Cc cu lnh trong JavaScript kt thc bng mt du chm phy (;). Mt khi lnh l on chng trnh gm hai lnh tr ln v c t trong cp ngoc nhn: { . . . } Bn trong mt khi lnh c th cha mt hay nhiu khi lnh khc. { // khi 1 { // khi 2 lnh 2.1 lnh 2.2 } // kt thc khi lnh 2 lnh 1.1 lnh 1.2 } // kt thc khi lnh 1 IV. Tan t & Biu thc trong JavaScript 1. nh ngha v phn loi biu thc Tp hp cc bin v cc ton t nhm nh gi mt gi tr no c gi l mt biu thc (expression). V c bn c ba kiu biu thc: S hc: Nhm lng gi gi tr s. V D: (3+4)+(84.5/3) bng 197.1666666667. Chui: Nhm nh gi chui. V D: "The dog+barked!" l The dog barked! Logic: Nhm nh gi gi tr logic. V D: 23>32 l False. (condition) ? valTrue : valFalse False. Nu iu kin condition l ng, biu thc nhn gi tr valTrue, ngc li nhn gi tr l V d: ketqua = (diemtb>=5) ? "u" : "Rt" Trong v d ny bin ketqua c gn gi tr "u" nu gi tr ca bin tdiemtb ln hn hoc bng 5; ngc li n nhn gi tr "Rt".
Bin san: Dng Thnh Pht Trang 36

Ngai ra JavaScript cng h tr biu thc iu kin, c php nh sau:

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

2. Cc Ton t. Ton t c s dng thc hin mt php ton. c nhm thnh cc loi sau y: gn, so snh, s hc, chui v logic. = Gn gi tr ca ton hng bn phi cho ton hng bn tri. == (Bng)Tr li gi tr ng nu ton hng bn tri bng ton hng bn phi != (Khc)Tr li gi tr ng nu ton hng bn tri khc ton hng bn phi > Tr li gi tr ng nu ton hng bn tri ln hn ton hng bn phi >= (Ln hn hoc bng)Tr li gi tr ng nu ton hng bn tri ln hn hoc bng ton hng bn phi < Tr li gi tr ng nu ton hng bn tri nh hn ton hng bn phi <= (Nh hn hoc bng)Tr li gi tr ng nu ton hng bn tri nh hn hoc bng ton hng bn phi var1 % var2 (Chia ly phn d) Tr li phn d khi chia var1 cho var2 (Ph nh) Cho gi tr ph nh ton hng var++ Ton t ny tng var ln 1 (c th biu din l ++var) var-Ton t ny gim var i 1 (c th biu din l --var) + Kt hp hai chui expr1 && expr2 Ton t AND tr v gi tr ng nu expr1 v expr2 cng ng. expr1 || expr2 Ton t OR tr v gi tr ng nu t nht 1 trong 2 expr1,expr2 ng. V. Cu trc lp trnh C th chia cc cu trc lp trnh ca JavaScript thnh 2 nhm sau:Cu trc r nhnh (iu kin) v Cu trc lp. 1. Cu trc lp trnh r nhnh (iu Kin) C php: if ( <iu kin> ) { //Cc cu lnh vi iu kin ng }else{ //Cc cu lnh vi iu kin sai } V d: To trang (CauTrucDK.htm) S dng phng php confirm() vi pht biu if
<HTML> <Head> <Title>Cu Trc iu Kin</Title> <Script Language="Javascript"> var question="What is 10+10 ?"; var answer=20; var correct="<IMG SRC='vui.gif'>"; var incorrect="<IMG SRC='buon.gif'>"; 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 Language="Javascript"> document.write(output); </Script> </Body> </HTML> Bin san: Dng Thnh Pht Trang 37

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

2. Cu trc lp a. Vng lp For Vng lp for thit lp 1 biu thc khi u - initExpr, sau lp 1 on m cho n khi biu thc <iu kin> c nh gi l ng. Sau khi kt thc mi vng lp, biu thc incrExpr c nh gi li. C php: for (initExpr; <iu kin>; incrExpr){ //Cc lnh c thc hin trong khi lp } V d: To trang (ForLoop.htm) nh sau
for (x=1; x<=10 ; x++) { y=x*25; document.write("x ="+ x +";y= "+ y + "<BR>"); }

b. Vng lp While Vng lp while lp khi lnh chng no <iu kin> cn c nh gi l ng C php: while (<iu kin>){ //Cc cu lnh thc hin trong khi lp } V d: To trang (WhileLoop.htm) nh sau
x=1; while (x<=10){ y=x*25; document.write("x="+x +"; y = "+ y + "<BR>"); x++; } //Kt qu ca v d ny ging nh v d trc.

Bin san: Dng Thnh Pht

Trang 38

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

c. Lnh Break Cu lnh break dng kt thc vic thc hin ca vng lp for hay while. Chng trnh c tip tc thc hin ti cu lnh ngay sau ch kt thc ca vng lp. C php: break; V d: Nu gi tr x a vo vng lp nh hn 50, vng lp s kt thc while (x<100){ if (x<50) break; x++; } d. Lnh Continue i vi vng lp while lnh continue iu khin quay li <iu kin>; vi for lnh continue iu khin quay li incrExpr. C php: continue; V d: on m sau tng x t 0 ln 5, nhy ln 8 v tip tc tng ln 10
x=0; while (x<=10) { document.write(Gi tr ca x l:+ x+<BR>); if (x=5){ x=8; continue; } x++; }

VI. Mng - Array Mc d JavaScript khng h tr cu trc d liu mng nhng to ra phng thc cho php bn t to ra cc hm khi to mng nh sau: function taomang(n) { this.length = n; for (var i=1; i<=n; i++){ this[i]=0 } return this; } To ra 1 mng vi kch thc xc nh trc (n) v in cc gi tr 0. V d: a = new taomang(10); a[1] = "Ngh An"; a[2] = "H Ni"; V d: To trang (Array.htm)
<HTML> <Head> <Title> Array Exemple </Title> <Script Language= "JavaScript"> function taomang(n) { this.length = n; for (var i=1; i<=n; i++){ this[i]=0 } Bin san: Dng Thnh Pht Trang 39

To ra cc thnh phn t a[1] n a[10] vi gi tr l 0. Gn gi tr cho cc thnh phn :

Bi Ging Mn Thit K Web return this; } a = new taomang(10); a[1] = "Ngh An"; a[2] = "H Ni"; document.write(a[1] + "<BR>"); document.write(a[2] + "<BR>"); </Script> </Head> <Body> </Body> </HTML>

Phn 2 : Ngn Ng Kch Bn JavaScript

VII. Hm - Function
1. Gii thiu Trong lp trnh s dng hm l thc hin mt on chng trnh no . Trong Javascript c cc hm c xy dng sn gip thc hin mt chc nng v ta cng c th nh ngha ra cc hm khc thc hin mt cng vic no . Hm c th c 1 hay nhiu tham s truyn vo v 1 gi tr tr v. Hm c th l thuc tnh ca 1 i tng, trong trng hp ny n c xem nh l phng thc ca i tng . 2. nh Ngha Hm C php: function fnName([param1],[param2],...,[paramN]){ //function statement } V d: To trang (Function.htm)
MTWRFSS

<HTML> <Head> <Title>Function</Title> <Script Language="JavaScript"> function testQuestion(question){ var answer=eval(question); var output="What is " + question + "?"; var correct="<IMG SRC='vui.gif'>"; var incorrect="<IMG SRC='buon.gif'>"; var response=prompt(output,"0"); return(response == answer)?correct:incorrect; } </Script></Head><Body> <Script Language="JavaScript"> var result=testQuestion("10 + 10"); document.write(result); </Script></Body> </HTML>

Bin san: Dng Thnh Pht

Trang 40

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

Ghi ch: Hm eval dng chuyn i gi tr chui thnh gi tr s eval(10*10) tr v gi tr l 100 3. Cc Hm C Sn JavaScript c mt s hm c sn, gn trc tip vo chnh ngn ng v khng nm trong mt i tng no: eval, parseInt, parseFloat a. Hm eval Chuyn i gi tr chui thnh gi tr s. C php: returnval=eval (biu thc) V d: To trang (Eval.htm)
<HTML> <Head><Title>Eval Example </Title> <Script Language= "JavaScript"> var string=10+ Math.sqrt(64); document.write(string+ =+ eval(string)); </Script> </Head> <Body> </Body> </HTML>

b. Hm parseInt Hm ny chuyn mt chui s thnh s nguyn vi c s l tham s th hai. C php: parseInt (string, [, radix]) V d: To trang (ParserInt.htm)
<HTML> <Head><Title>ParserInt Example </Title><Body> <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> </Body></HTML>

Bin san: Dng Thnh Pht

Trang 41

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

c. Hm parseFloat Hm ny ging hm parseInt nhng n chuyn chui thnh s biu din di dng du phy ng. C php: parseFloat (string) V d: To trang (ParserFloat.htm)
<Body> <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> </Body>

Bin san: Dng Thnh Pht

Trang 42

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

Chng 03

I TNG & S KIN


i tng v thao tc trn i tng S kin v x l s kin Cc i tng thng dng I. Khi Nim i Tng 1. Khi Nim V i Tng JavaScript l ngn ng lp trnh da trn i tng, nhng khng hng i tng Trong s phn cp cc i tng ca JavaScript, cc i tng con thc s l cc thuc tnh ca cc i tng cha. Vi d chng trnh x l s kin trn form tn frmDieutra l thuc tnh ca i tng document v trng text txtAge l thuc tnh ca form frmDieutra. tham chiu n gi tr ca txtAge phi s dng: document.frmDieucha.txtAge.value S sau s minh ho s phn cp ca cc i tng
Window Frame document Location History Layer Link Image Area Anchor Applet Plugin Form Texturea Text FileUpload Password Hidden Submit Reset Radio Checkbox Button Select Option navigator Plugin Mime Type

2. Cc cu lnh thao tc trn i tng a. Lnh For...in

Cu lnh ny c s dng bit tt c cc thuc tnh (properties) ca mt i tng. for (<variable> in <object>) { //Cc cu lnh }

Bin san: Dng Thnh Pht

Trang 43

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

V d: To trang (ForIn.htm) in tt c cc thuc tnh ca i tng Window.


<Body> <SCRIPT LANGUAGE= "JavaScript"><BODY> document.write("The properties of the Window object are: <BR>"); for (var x in window) document.write(" "+ x + ", "); </SCRIPT> </Body>

b. Bin new Bin new c thc hin to ra mt th hin mi ca mt i tng objectvar = new object_type ( param1 [,param2]... [,paramN]) c. T Kha This T kho this c s dng ch i tng hin thi. this [.property] d. Lnh With Lnh ny c s dng thit lp i tng ngm nh cho mt nhm cc lnh. with(object){ // statement } V d: To trang (Object.htm) minh ho cch to v s dng bin New, t khoa this v lnh with.
<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>

Bin san: Dng Thnh Pht

Trang 44

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

II. S Kin & X Ly S Kin 1. Khi nim s kin v x ly s kin JavaScript l ngn ng nh hng s kin, ngha l s phn ng trc cc s kin nh: Click chut . . . Chng trnh x l s kin (Event handler) l 1 on m hay 1 hm c thc hin phn ng trc 1 s kin c xc nh l mt thuc tnh ca mt th HTML: <tagName eventHandler = "JavaScript Code or Function"> V d:Trang EventHander.htm thm nh gi tr a vo trong trng text Tui phai hp l nu s xut hin thng bo yu cu nhp li.
<HTML> <HEAD><Title> An Event Handler Exemple </Title> <Script Language= "JavaScript"> function CheckAge(form) { if ( (form.AGE.value<0)||(form.AGE.value>120) ) { alert("Tui nhp vo khng hp l! Mi bn nhp li"); form.AGE.value=0; } } </Script> </Head><Body> <Form NAME="frmDieutra"> Nhp vo tn ca bn:<BR> Tn <Input Type=Text Name="TEN" ><BR> m <Input Type=Text Name="DEM" ><BR> H <Input Type=Text Name="HO" ><BR> Age <Input Type=Text Name="AGE" onChange="CheckAge(frmDieutra)"><BR> <Input Type=Submit Value=Submit> <Input Type=Reset Value=Reset> </Form> </Body></HTML>

Bin san: Dng Thnh Pht

Trang 45

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

2. Mt s s kin trong JavaScript: onBlur Xy ra khi input focus b xo t thnh phn form onClick Xy ra khi ngi dng kch vo cc thnh phn hay lin kt ca form. onChange Xy ra khi gi tr ca thnh phn c chn thay i onFocus Xy ra khi thnh phn ca form c focus(lm ni ln). onLoad Xy ra trang Web c ti. onMouseOver Xy ra khi di chuyn chut qua kt ni hay anchor. onSelect Xy ra khi ngi s dng la chn mt trng nhp d liu trn form. onSubmit Xy ra khi ngi dng a ra mt form. onUnLoad Xy ra khi ngi dng ng mt trang 3. cc s kin c sn ca mt s i tng. i tng Chng trnh x l s kin c sn Selection list onBlur, onChange, onFocus Text onBlur, onChange, onFocus, onSelect Textarea onBlur, onChange, onFocus, onSelect Button onClick Checkbox onClick Radio button onClick Hypertext link onClick, onMouseOver, onMouseOut Clickable Imagemap area onMouseOver, onMouseOut Reset button onClick Submit button onClick Document onLoad, onUnload, onError Window onLoad, onUnload, onBlur, onFocus Framesets onBlur, onFocus Form onSubmit, onReset Image onLoad, onError, onAbort V d: Trang LoadUnLoad.htm
<HTML> <HEAD> <TITLE>Event Handler</TITLE> </HEAD> <BODY onLoad="alert('Welcome to my page!');" onUnload="alert('Goodbye! ');"> <IMG SRC="Logo.jpg"> </BODY> </HTML>

III. CC I TNG THNG DNG 1. i tng window i tng window l i tng mc cao nht. Cc i tng document, frame, location u l thuc tnh ca i tng window. Cc thuc tnh: defaultStatus Frames Length Thng bo ngm nh hin th ln trn thanh trng thi ca ca s Mng xc nh tt c cc frame trong ca s. S lng cc frame trong ca s cha.
Trang 46

Bin san: Dng Thnh Pht

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

Name Parent Self Status Top Window

Tn ca ca s hin thi. i tng ca s chA Ca s hin thi. c s dng thng bo tm thi hin th ln trn thanh trng thi ca s. Ca s trn cng. Ca s hin thi. Hin th hp thoi vi chui "message" v nt OK. Xa timeout do SetTimeout t. SetTimeout tr li timeoutID ng ca s windowReference. Hin th hp thoi vi chui "message", nt OK v nt Cancel. Tr li tr True cho OK v False cho Cancel. M ca s mi. M hp hi thoi nhn d liu vo trng text. nh gi biu thc expresion sau thi gian msec.

Cc phng thc alert ("message") clearTimeout(timeoutID) WindowReference.close confirm("message") [windowVar = ][window]. open("URL", "windowName", [ "windowFeatures" ] ) prompt ("message" [,"defaultInput"]) TimeoutID = setTimeout(expression,msec)

V d:TrangWindows.htm nt th nht m ca s rng, sau mt lin kt s ti File doc2.html xung ca s mi ri mt nt khc dng ng ca s th hai li,
<HTML> <Head><Title>Window Object </Title></Head> <Body> <Form> <Input Type="button" VALUE="Open Second Window" onClick="msgWindow=window.open('','window2','resizable=no,width=200,height=200')"> <BR><A HREF="doc.htm" TARGET="window2"> Load a File into window2 </A> <Input Type="button" VALUE="Close Second Window" onClick="msgWindow.close()"> </Form> </Body> </HTML>

2. i tng forms Cc form c to ra nh cp th <FORM> . . . </FORM>. C mt vi phn t (elements) ca i tng forms nh: Button, checkbox, password, radio, reset, select, submit, text, textarea Cc thuc tnh Action thuc tnh ACTION ca th FORM. Elements Mng cha cc thnh phn trong form (nh checkbox, textBOX . . Encoding Xu cha kiu MIME c s dng m ho ni dung ca form gi cho server. length S lng cc thnh phn trong mt form. Method Thuc tnh METHOD. target Xu cha tn ca ca s ch khi submit form

Bin san: Dng Thnh Pht

Trang 47

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

Cc phng thc formName.submit () - Xut d liu ca mt form tn formName ti trang x l. Phng thc ny m phng mt click vo nt submit trn form. Cc phn t ca i tng Form Form c to bi cc phn t cho php ngi s dng a thng tin vo. Khi , ni dung (hoc gi tr) ca cc phn t s c chuyn n mt chng trnh trn server qua mt giao din c gi l Common Gateway Interface(Giao tip qua mt cng chung) gi tt l CGI B ng Cc ph n t c a form Phn t M t Button L mt nt bm hn l nt submit hay nt reset (<INPUT TYPE="button">) Checkbox Mt checkbox (<INPUT TYPE="checkbox">) FileUpload L mt phn t ti File cho php s dng gi ln mt File (<INPUT TYPE="File">) Hidden Mt trng n (<INPUT TYPE="hidden">) Password Mt trng text nhp mt khu m tt c cc k t nhp vo u hin th l du (*)(<INPUT TYPE="password">) Radio Mt nt bm (<INPUT TYPE="radio">) Reset Mt nt reset(<INPUT TYPE="reset">) Select Mt danh sch la chn (<SELECT><OPTION>option1</OPTION> <OPTION>option2</OPTION></SELECT>) Submit Mt nt submit (<INPUT TYPE="submit">) Text Mt trng text (<INPUT TYPE="text">) textArea Mt trng text cho php nhp vp nhiu dng <TEXTAREA>default text</TEXTAREA>) Thuc tnh Name : Mi phn t c t tn JavaScript truy cp n chng qua Thuc tnh Ttype : l mt xu ch nh r kiu ca phn t c a vo nh nt bm, mt trng text hay mt checkbox... l mt 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" a. Ph n t button Trong mt form HTML chun, ch c hai nt bm c sn l submit v reset bi v d liu trong form phi c gi ti mt a ch URL x l v lu tr. Mt phn t button c ch nh r khi s dng th INPUT: <INPUT TYPE="button" NAME="name" VALUE= "buttonName"> name l tn ca button, buttonname l nhn ca button s c hin th. Ch c mt s kin duy nht l onClick.
Bin san: Dng Thnh Pht Trang 48

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

V d:Trang Button.htm nh gi tr trong form s dng phn t button.


<HTML> <Head><Title>button Example</Title> <Script Language="JavaScript"> function calculate(form) { form.results.value = eval(form.entry.value); } </Script> </Head> <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>

b. Ph n t checkbox Cc phn t checkbox c kh nng bt tt dng chn hoc khng chn mt thng tin. Bang danh sch cc thuc tnh v cc phng thc checked Cho bit trng thi hin thi ca checkbox defaultChecked Cho bit trng thi mc nh ca phn t name Cho bit tn ca phn t c ch nh trong th INPUT value Cho bit gi tr hin thi ca phn t c ch nh trong th INPUT click() M t mt click vo checkbox (Phng thc) V d: Trang Checkbox.htm To hp checkbox nhp vo mt s la chn:
<HTML><Head><Title>Checkbox Example</Title> <Script> function calculate(form,callingField) { if (callingField == "result") { if (form.square.checked){ form.entry.value = Math.sqrt(form.result.value); }else{ form.entry.value = form.result.value / 2; } //end if(2) }else{ if (form.square.checked){ form.result.value=form.entry.value*form.entry.value; }else { form.result.value = form.entry.value * 2; } } } </Script> </Head> <Body> Bin san: Dng Thnh Pht Trang 49

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

<Form Method=Post> Value: <Input Type="text" NAME="entry" VALUE=0 onChange="calculate(this.form,this.name);"><BR> Action: <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>

c. Ph n t File Upload Phn t ny cung cp cho form mt cch ngi s dng c th ch r mt File a vo form x l. d. Ph n t hidden Phn t hidden l phn t khng c hin th trn Web browser. Trng hidden c th s dng lu cc gi tr cn thit gi ti server song song vi s xut ra t form nhng n khng c hin th trn trang. e. Ph n t Password i tng Password l i tng m khi g bt k k t no vo cng u hin th du sao(*). Dng nhp nhng thng tin b mt nh mt khu... f. Ph n t radio i tng radio gn ging s bt tt checkbox. Khi nhiu radio c kt hp thnh mt nhm, ch c mt nt c chn trong bt k mt thi im no. Nhm cc nt radio li bng cch t cho chng c cng mt tn trong cc th INPUT. Bng sau hin th cc thuc tnh v cch thc ca i tng radio. Thuc tnh v cch thc M t checked M t trng thi hin thi ca phn t radio defaultChecked M t trng thi mc nh ca phn t index M t th t ca nt radio c chn hin thi trong mt nhm length M t tng s nt radio trong mt nhm name M t tn ca phn t c ch nh trong th INPUT value M t gi tr hin thi ca phn t c nh ra trong th INPUT click() M phng mt click trn nt radio (cch thc) V d: Trang RadioButton.htm
<HTML><Head><Title>Radio button Example</Title> <Script> function calculate(form,callingField) { if (callingField == "result") { if (form.action[1].checked) { form.entry.value = Math.sqrt(form.result.value); } else { form.entry.value = form.result.value / 2; } } else { if (form.action[1].checked) { Bin san: Dng Thnh Pht Trang 50

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

} } </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>

form.result.value=form.entry.value*form.entry.value; } else { form.result.value = form.entry.value * 2; }

g. Ph n t reset S dng i tng reset, cng ging i tng button, i tng reset c hai thuc tnh l name v value v mt s kin onClick. i tng reset dng xo form. V d: Trang ResetButton.htm minh ho cch s dng nt reset xo cc gi tr ca form.
<HTML> <Head> <Title>reset Example</Title> <Script Language="JavaScript"> function clearForm(form) { form.value1.value = "Form"; form.value2.value = "Cleared"; } </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>

Bin san: Dng Thnh Pht

Trang 51

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

h. Ph n t select Danh sch la chn trong cc form xut hin menu drop-down hoc danh sch cun c ca cc i tng c th c la chn. Cc danh dch c xy dng bng cch s dng hai th SELECT v OPTION. <SELECT NAME="test"> <OPTION SELECTED>1 <OPTION>2 <OPTION>3 </SELECT> To ra ba thnh phn ca menu th drop-down vi ba la chn 1,2 v 3. S dng thuc tnh SIZE bn c th to ta mt danh sch cun vi s phn t hin th ln th nht. bt menu drop-down trong mt menu cun vi hai thnh phn hin th, bn c th s dng nh sau: <SELECT NAME="test" SIZE=2> <OPTION SELECTED>1 <OPTION>2 <OPTION>3 </SELECT> Trong c hai V D: trn, ngi s dng ch c 1 la chn. Nu s dng thuc tnh MULTIPLE, bn c th cho php ngi s dng la chn nhiu hn 1 gi tr trong danh sch la chn: <SELECT NAME="test" SIZE=2 MULTIPLE> <OPTION SELECTED>1 <OPTION>2 <OPTION>3 </SELECT> Danh sch la chn trong JavaScript l i tng select. i tng ny to ra mt vi thnh phn tng t cc button v radio. Vi cc thnh phn la chn, danh sch cc la chn c cha trong mt mng c nh s t 0. Trong trng hp ny, mng l mt thuc tnh ca i tng select gi l options. C vic la chn cc option v tng phn t option ring bit u c nhng thuc tnh. B sung thm vo mng option, phn t select c thuc tnh selectedIndex, c cha s th t ca option c la chn hin thi. Mi option trong danh sch la chn u c mt vi thuc tnh: DEFAULTSELECTED Cho bit option c mc nh l chn trong th OPTION hay khng. INDEX Cha gi tr s th t ca option hn thi trong mng option.
Bin san: Dng Thnh Pht Trang 52

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

SELECTED TEXT

Cho bit trng thi hin thi ca option C cha gi tr ca dng text hin th trn menu cho mi option, v thuc tnh value mi gi tr ch ra trong th OPTION.

V d: C danh sch la chn 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 ln u tin hin th bn c th truy nhp ti 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 Nu ngi s dng kch vo menu v la chn option th hai, th th onFocus s thc hin, v khi gi tr ca thuc tnh s l: example.options[1].value = "The Second" example.options[2].text = "3" example.selectedIndex = 1 example.options[0].defaultSelected = true example.options[1].selected = true C th thm cc la chn mi vo danh sch bng cch s dng i tng xy dng Option() theo c php: newOptionName = new Option(optionText, optionValue, defaultSelected, selected); selectListName.options[index] = newOptionName; Vic to i tng option() ny vi dng text c ch trc, defaultSelected v selected nh trn nh ra nhng gi tr kiu Boolean. i tng ny c lin kt vo danh sch la chn c thc hin bng index. Cc la chn c th b xo trong danh sch la chn bng cch gn gi tr null cho i tng mun xo selectListName.options[index] = null; i. Ph n t submit Nt Submit l mt trng hp c bit ca button, cng nh nt Reset. Nt ny a thng tin hin ti t cc trng ca form ti a ch URL c ch ra trong thuc tnh ACTION ca th form s dng cch thc METHOD ch ra trong th FORM. j. Ph n t Text Phn t ny nm trong nhng phn t hay c s dng nht trong cc form HTML. Trng text cho php nhp vo mt dng n.

Bin san: Dng Thnh Pht

Trang 53

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

Bng sau m t cc thuc tnh v phng thc. Cch thc v thuc tnh M t defaultValue Ch ra gi tr mc nh ca phn t c ch ra trong th INPUT (thuc tnh) name Tn ca i tng c ch ra trong th INPUT (thuc tnh) value Gi tr hin thi ca phn t (thuc tnh) focus() M t vic con tr ti trng text (cch thc) blur() M t vic con tr ri trng text (cch thc) select() M t vic la chn dng text trong trng text (cch thc) V d:Trang TextField.htm T ng cp nht cc trng text .
<HTML> <HEAD> <TITLE>TextField Example</TITLE> <SCRIPT LANGUAGE="JavaScript"> function echo(form,currentField){ if (currentField == "first") form.second.value = form.first.value; else form.first.value = form.second.value; } </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>

k. Ph n t Textarea Th TEXTAREA cung cp mt hp cho php nhp s dng text do ngi thit k nh trc. V D: <TEXTAREA NAME="fieldName" ROWS=10 COLS=25> Default Text Here </TEXTAREA> V D: ny to ra mt trng text cho php a vo 10 hng ,mi hng 25 k t. Dng "Defautl Text Here"s xut hin trong trng ny vo ln hin th u tin. Cng nh phn t text , JavaScript cung cp cho bn cc thuc tnh defaultValue, name, v value, cc cch thc focus(), select(), v blur(), cc th s kin onBlur, onForcus, onChange, onSelect. Mng elements[]

Bin san: Dng Thnh Pht

Trang 54

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

Cc i tng ca form c th c gi ti bng mng elements[]. V D: bn to ra mt form sau: <FORM METHOD=POST NAME=testform> <INPUT TYPE="text" NAME="one"> <INPUT TYPE="text" NAME="two"> <INPUT TYPE="text" NAME="three"> </FORM> Bn c th gi ti ba thnh phn ny nh sau: document.elements[0], document.elements[1], document.elements[2], Hn na cn c th gi document.testform.one, document.testform.two, document.testform.three. 3. i tng Date i tng Date l i tng c sn trong JavaScript. N cung cp nhiu phng thc c ch x l v thi gian v ngy thng. Cc phng thc dateVar.getDate() dateVar.getDay() dateVar.getHours() dateVar.getMinutes() dateVar.getSeconds() dateVar.getTime() dateVar.getTimeZoneOffset() dateVar.getYear() Date.parse (dateStr) dateVar.setDay(day) dateVar.setHours(hours) dateVar.setMinutes(minutes) dateVar.setMonths(months) dateVar.setSeconds(seconds) dateVar.setTime(value) dateVar.setYear(years) dateVar.toGMTString() dateVar.toLocaleString()
Bin san: Dng Thnh Pht

Tr li ngy trong thng (1-31) cho dateVar. Tr li ngy trong tun (0=ch nht,...6=th by) cho dateVar. Tr li gi (0-23) cho dateVar. Tr li pht (0-59) cho dateVar. Tr li giy (0-59) cho dateVar. Tr li s lng cc mili giy t 00:00:00 ngy 1/1/1970. Tr li dch chuynbng pht ca gi a phng hin ti so vi gi quc t GMT. Tr li nm cho dateVar. Phn tch chui dateStr v tr li s lng cc mili giy tnh t 00:00:00 ngy 01/01/1970. t ngy trong thng l day cho dateVar. t gi l hours cho dateVar. t pht l minutes cho dateVar. t thng l months cho dateVar. t giy l seconds cho dateVar. t thi gian l value, trong value biu din s lng mili giy t 00:00:00 ngy 01/01/1970. t nm l years cho dateVar. Tr li chui biu din dateVar di dng GMT. Tr li chui biu din dateVar theo khu vc thi gian hin thi.
Trang 55

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

Date.UTC (year, month, day Tr li s lng mili giy t 00:00:00 01/01/1970 GMT. [,hours] [,minutes] [,seconds]) V d:To trang (DatTime.htm)
<head><meta content="charset=unicode"></head> <Script Language="JavaScript"> mydate = new Date(); myday = mydate.getDay() ; mymonth = mydate.getMonth()+1; myweekday= mydate.getDate(); weekday= myweekday; myyear= 1900 + mydate.getYear(); myhours = mydate.getHours(); ampmhour = (myhours > 12) ? myhours - 12 : myhours; ampm = (myhours >= 12) ? 'Bui chiu ' : ' Bui sng '; myminutes = mydate.getMinutes(); myminutes = ((mytime < 10) ? ':0' : ':') + mytime; if(myday == 0) day = " Ch nht , "; else if(myday == 1) day = " Th hai , "; else if(myday == 2) day = " Th ba, "; else if(myday == 3) day = " Th t, "; else if(myday == 4) day = " Th nm , "; else if(myday == 5) day = " Th su , "; else if(myday == 6) day = " Th by , "; </script> <body> <script> document.write("<b>" +"By gi l: "+ ampmhour + "" + myminutes +" "+ ampm) document.write(" - " + day + " Ngy " + myweekday +" "); document.write( " Thng " + mymonth + " Nm " + year + "</font>"); </script> </body>

4. i tng Math i tng Math l i tng ni ti trong JavaScript. Cc thuc tnh ca i tng ny cha nhiu hng s ton hc, cc hm ton hc, lng gic ph bin Cc thuc tnh E LN2 LN10 LOG2E PI SQRT1_2
Bin san: Dng Thnh Pht

Hng s Euler, khong 2,718. logarit t nhin ca 2, khong 0,693. logarit t nhin ca 10, khong 2,302. logarit c s 2 ca e, khong 1,442. Gi tr ca , khong 3,14159. Cn bc 2 ca 0,5, khong 0,707.
Trang 56

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

SQRT2 Cc phng thc Math.abs (number) Math.acos (number) Math.asin (number) Math.atan (number) Math.ceil (number) Math.cos (number) Math.exp (number) Math.floor (number) Math.log (number) Math.max (num1,num2) Math.min (num1,num2) Math.pos (base,exponent) Math.random (r) Math.round (number) Math.sin (number) Math.sqrt (number) Math.tan (number) 5. i tng String

Cn bc 2 ca 2, khong 1,414. Tr li gi tr tuyt i ca number. Tr li gi tr arc cosine (theo radian) ca number. Gi tr ca number phi nmg gia 1 v 1. Tr li gi tr arc sine (theo radian) ca number. Gi tr ca number phi nmg gia 1 v 1. Tr li gi tr arc tan (theo radian) ca number. Tr li s nguyn nh nht ln hn hoc bng number. Tr li gi tr cosine ca number. Tr li gi tr e^ number, vi e l hng s Euler. Tr li s nguyn ln nht nh hn hoc bng number. Tr li logarit t nhin ca number. Tr li gi tr ln nht gia num1 v num2 Tr li gi tr nh nht gia num1 v num2. Tr li gi tr base lu tha exponent. Tr li mt s ngu nhin gia 0 v 1. Phwong thc ny ch thc hin c trn nn tng UNIX. Tr li gi tr ca number lm trn ti s nguyn gn nht. Tr li sin ca number. Tr li cn bc 2 ca number. Tr li tag ca number.

i tng String l i tng c xy dng ni ti trong JavaScript cung cp nhiu phng thc thao tc trn chui. Cc phng thc str.anchor (name) str.big() str.blink() str.bold() str.charAt(a) str.fixed() str.fontcolor() str.fontsize(size) str.index0f(srchStr [,index]) str.italics() str.lastIndex0f(srchStr [,index]) str.link(href) str.small() str.strike() str.sub() str.substring(a,b) str.sup() str.toLowerCase()
Bin san: Dng Thnh Pht

c s dng to ra th <A> (mt cch ng). Tham s name l thuc tnh NAME ca th <A>. Kt qu ging nh th <BIG> trn chui str. Kt qu ging nh th <BLINK> trn chui str. Kt qu ging nh th <BOLD> trn chui str. Tr li k t th a trong chui str. Kt qu ging nh th <TT> trn chui str. Kt qu ging nh th <FONTCOLOR = color>. Kt qu ging nh th <FONTSIZE = size>. Tr li v tr trong chui str v tr xut hin u tin ca chui srchStr. Chui str c tm t tri sang phi. Tham s index c th c s dng xc nh v tr bt u tm kim Kt qu ging nh th <I> trn chui str. Tr li v tr trong chui str v tr xut hin cui cng ca chui srchStr. Chui str c tm t phi sang tri. Tham s index c th c s dng xc nh v tr bt u tm kim. c s dng to ra mt kt ni HTML ng cho chhui str. Tham s href l URL ch ca lin kt. Kt qu ging nh th <SMALL> trn chui str. Kt qu ging nh th <STRIKE> trn chui str. To ra mt subscript cho chui str, ging th <SUB>. Tr li chui con ca str l cc k t t v tr th a ti v tr th b. Cc k t c m t tri sang phi bt u t 0. To ra superscript cho chui str, ging th <SUP>. i chui str thnh ch thng.
Trang 57

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

str.toUpperCase() 6. i tng history

i chui str thnh ch hoa.

i tng ny c s dng lu gi cc thng tin v cc URL trc c ngi s dng s dng. Danh sch cc URL c lu tr theo th t thi gian. Cc thuc tnh Length - S lng cc URL trong i tng. Cc phng thc history.back() - c s dng tham chiu ti URL mi c thm trc y. history.forward() - c s dng tham chiu ti URL k tip trong danh sch. history.go (delta | "location") - c s dng chuyn ln hay chuyn xung delta bc hay di chuyn n URL xc nh bi location trong danh sch. Dch chuyn ln pha trn khi delta dng v xung pha di khi delta m. 7. i tng links i tng link l mt on vn bn hay mt nh c xem l mt siu lin kt. Cc thuc tnh ca i tng link ch yu x l v URL ca cc siu lin kt. V D:http:// www.abc.com/ chap1/page2.html#topic3 Cc thuc tnh hash Tn anchor ca v tr hin thi (V D: topic3). Host Phn hostname:port ca URL (V D: www.abc.com). Hostname Tn ca host v domain (V D: ww.abc.com). href Ton b URL cho document hin ti. Pathname Phn ng dn ca URL (V D: /chap1/page2.html). port Cng truyn thng c s dng cho my tnh host, thng l cng ngm nh. Protocol Giao thc c s dng (cng vi du hai chm) (V D: http:). Search Cu truy vn tm kim c th cui URL cho cc script CGI. Target Ging thuc tnh TARGET ca <LINK> 8. i tng location thi. Cc thuc tnh ca i tng location duy tr cc thng tin v URL ca document hin V d: http:// www.abc.com/ chap1/page2.html#topic3 Cc thuc tnh hash Tn anchor ca v tr hin thi (V D: topic3). Host Phn hostname:port ca URL (V D: www.abc.com ). Hostname Tn ca host v domain (V D: www.abc.com ). href Ton b URL cho document hin ti. Pathname Phn ng dn ca URL (V D: /chap1/page2.html). Port Cng truyn thng c s dng cho my tnh host, thng l cng ngm nh. Protocol Giao thc c s dng (cng vi du hai chm) (V D: http:). Search Cu truy vn tm kim c th cui URL cho cc script CGI. 9. i tng Navigator i tng ny c s dng c cc thng tin v trnh duyt nh s phin bn. i tng ny khng c phng thc hay s kin. Cc thuc tnh appCodeName AppName
Bin san: Dng Thnh Pht

Xc nh tn m ni ti ca trnh duyt (Atlas). Xc nh tn trnh duyt.


Trang 58

Bi Ging Mn Thit K Web

Phn 2 : Ngn Ng Kch Bn JavaScript

AppVersion userAgent 10. i tng document

Xc nh thng tin v phin bn ca i tng navigator. Xc nh header ca user - agent.

i tng ny cha cc thng tin v document hin thi. i tng document c to ra bng cp th <BODY> v </BODY>. Mt s cc thuc tnh gn vi th <BODY>. Cc thuc tnh alinkColor anchor bgColor cookie fgColor forms lastModified linkColor links location referrer title vlinkColor Cc phng thc document.clear document.close document.open (["mineType"]) document.write(expression1 [,expression2]...[,expressionN]) document.writeln (expression1 [,expression2] ... [,expressionN] ) Xo document hin thi. ng dng d liu vo v a ton b d liu ra mn hnh. M mt stream thu thp d liu vo ca cc phng thc write v writeln. Vit biu thc HTML ln vn bn trng mt ca s xc nh. Ging phng thc trn nhng khi ht mi biu thc li xung dng. Ging nh thuc tnh ALINK. Mng tt c cc anchor trong document. Ging thuc tnh BGCOLOR. S dng xc nh cookie. Ging thuc tnh TEXT. Mng tt c cc form trong document. Ngy cui cng vn bn c sa. Ging thuc tnh LINK. Mng tt c cc link trong document. URL y ca vn bn. URL ca vn bn gi n. Ni dung ca th <TITLE>. Ging thuc tnh VLINK.

LI KT
Bn c th tham kho ton din JavaScript trong quyn Teach Yourself JavaScript in 14 Days, hoc JavaScript Guide. Do JavaScript l ngn ng cn mi v c s thay i nhanh chng, bn nn n vi trang Web ca hng Netscape ( http://www.netscape.com ) c cc thng tin mi nht v ngn ng ny.

Bin san: Dng Thnh Pht

Trang 59

You might also like