TRUNG TM HNG YN APTECH a ch :Tng 2, Nh A i hc SPKT Hng Yn in thoi:0321-713.319; Fax: 0321-713.015 E-mail:[email protected];Website:http://www.aptech.utehy.vn C BN VHTML, JAVASCRIPT, CSS V ASP Ti liu tham kho trc khi tham d kha hc ASP.NET Bin son:1.Nguyn Minh Qu 2.Phm Ngc Hng 3.L Quang Li HNG YN 7/20082 TRUNG TM HNG YN APTECH a ch :Tng 2, Nh A i hc SPKT Hng Yn in thoi:0321-713.319; Fax: 0321-713.015 E-mail:[email protected];Website:http://www.aptech.utehy.vn TI LIU DNH CHO KHA HC ASP.NET C BN V HTML, JAVASCRIPT, CSS V ASP + Tiliunychanhngg?Tiliunychamtsbitpkmgiithchcc kinthclinquannkthutlptrnhWebcbnphaClientvServer.Ni dung bao gm: Phn A Chng 0: To cc phn t HTML. Chng I: Bi tp c bn v JavaScript.Chng II: S dng cc lp (i tng) x l Chui, Ngy thng, Ton hc. Chng III: X l s kin trong trang HTML vi JavaScript Chng IV: nh dng cc phn t HTML bng CSS Chng V: To v x l cc tng (Layer) Chng VI: Ni dung ng v nh v ng Phn B Chng I: C bn v lp trnh pha my ch - dng ASP Chng II: Cc i tng x l pha Server Chng III: Thao tc vi C s d liu + Ai nn c ti liu ny L Sinh vin, gio vin hoc nhng ngi cn c kin thc v lp trnh Web. + Cn c nhng kin thc g trc khi c ti liu ny? Cn c kin thc c bn v lp trnh ni chung. + Tc gi ca ti liu. -Th.s Nguyn Minh Qu [email protected] -Th.s Phm Ngc Hng [email protected] L Quang Li [email protected] + Gio trnh l thuyt -HTML, DHTML & JavaScript + Cc trang web nn gh thm -Ta liu trn forum www.utehy.vn/forum-www.3schools.com -Search vi t kha Java Script tutorial; Java script Introduction 3MC LC Chng 0: To cc phn t HTML c bn. .................................................. 4 1. C php chung: ................................................................................................................. 4 2. To mt s phn t c bn................................................................................................ 4 Chng I: Bi tp c bn v JavaScript...................................................... 6 Chng II: S dng cc lp x l Chui, Ngy thng, Ton hc. ............. 11 Chng III: X l s kin trong trang HTML vi JavaScript .................... 19 Chng IV: nh dng cc phn t HTML bng CSS................................. 28 Chng V: To v x l cc tng (Layer).................................................. 38 Chng VI: Ni dung ng v nh v ng.............................................. 44 Phn B : ASP............................................................................................. 50 I. ASP l g ? ............................................................................................. 50 1. Gii thiu ASP................................................................................................................ 50 2. C ch hot ng ............................................................................................................ 50 3. u v nhc im ca ASP............................................................................................ 52 II. Cu trc ca mt file ASP .................................................................... 52 1. Cu trc tng qut........................................................................................................... 52 2. Mt s lu : ................................................................................................................... 53 III. Cc i tng Server.......................................................................... 53 1. i tng Response........................................................................................................ 53 2 i tng Request ........................................................................................................... 54 3 i tng server .............................................................................................................. 62 4 i tng session bin sesstion.................................................................................... 64 5 i tng application ...................................................................................................... 67 6 Chn file vo trang asp .................................................................................................... 68 IV. Kt ni v thao tc vi CSDL trong asp............................................... 70 1. Qui tc chung.................................................................................................................. 70 2. To i tng Connection v kt ni n CSDL............................................................ 70 3. To i tng Recordset................................................................................................. 71 4. Mt s v d .................................................................................................................... 71 4Chng 0: To cc phn t HTML c bn. Mc tiu: Kt thc chng ny, ngi hc c th To cc phn t HTML c bn bng cch code trc tipDng Notepad to mt trang web cha cc phn t HTML Ni dung Gii thiu Trong nhiu ng dng web khng phi lc no chng ta cng c th s dng trnh son tho tch hp kiu nh Frontpage hay Dreamweaver thit k giao din, c bit l khi giao din c lin quan n yu t lp trnh. Khi ngi lp trnh hon ton phi to cc phn t HTML hon ton th cng (Code ch khng dng ko th). V vy, vic hiu c php to cc phn t HTML l v cng quan trng. 1. C php chung: + + +Kt hp c hai cch. Trong :Tn loi phn t HTMLThuc tnh ButtonName TextVALUE FileMAXLENGTH HiddenReadOnly SelectDisable TextAreaCols, Rows CheckBoxMultipleTYPE Phn gi tr c th t trong cp ngoc kp hoc cp ngoc n hoc khng cn !! Nu t thuc tnh theo cch 2, th c th tham chiu bng sau (gi l theo c php CSS)2. To mt s phn t c bn +To nt nhn +To nhp 5+To vng nhp (Textarea) Ni dung ghi ch: +To nhp Password +To listbox Visual Basic Lp trnh .NET Lp trnh ASP +To ComboBox (ch cn b thuc tnh size) Visual Basic Lp trnh .NET Lp trnh ASP +To hp kim Visual Basic Active Server Pages +To nt Radio
Tn ging nhau th s thuc v cng mt nhm (Groups) +Phn t chn File +To
textbox n (Hidden). To cc phn t v t thuc tnh: + To mt textbox v t
thuc tnh font: + To mt textbox v t thuc tnh thng qua phong cch CSS:
+ To mt nhn c font ch xanh, c hiu ng: 6Xin cho + To mt nt nhn c mu
nn : Kt qu Chng I: Bi tp c bn v JavaScript Mc tiu: Kt thc chng ny
ngi hc c th: Vit cc cu lnh JavaScript v nhng vo trang web S dng c
cc i tng nhp xut Promt, document.write. Truy xut thuc tnh ca cc phn
t HTML bng cu lnh JavaScript Vit lnh x l mt s s kin n gin. Ni dung:
7V d 1: Cho ngi dng nhp vo tn v tui. Hy vit li tn v tui ca ngi ra
mn hnh bng hm document.write, trong tn c mu m, tui c gch chn. Gii
mu: var Ten, Tuoi; // Khai bo 2 bin lu tn v tui Ten= prompt("Bn hy
nhp vo tn ", ""); Tuoi = prompt("Bn hy nhp vo Tui : ", 20);
document.write("Cho bn : " + Ten + "");
document.write("
");// Xung dng document.write("Tui ca bn l : " + Tuoi + "");
Vd2:Tomtntnhn(button)cnamelwelcome,valuel"Welcome".Mt textbox c tn
l msg, value = "Welcome to". Hng dn : S dng phng thc (hm) write ca
i tng document to. Gii mu: document.write("Tao Button va Text bang
Script
"); document.write("
"); document.write(" "); document.write(""); V d 3: To mt nt nh
trong v d 2 v thm chc nng sau: Khi ngi dng click vo nt welcome th
hin th thng bo "Welcome to JavaScript !"
Hngdn:DngthtontnhnvthmthuctnhonClick=";"(TrongcthlmtlnhJavaScriptbtk,vd
lnh document.write, alert, prompt hoc lnh gi hm v.v...) Gii mu: Lu
quan trng: Trong JavaScript, mt hng xu c bao bi cp nhy n hoc nhy
kp, v d cc xu: 'nhy n',"nhy kp" l nhng xu hp l, tuy nhin bn vit :
'abc" hay "xyz'lnhngxukhnghpl.Trongtrnghpbnmuninchnhbnthndunhy n
hoc nhy kp ra mn hnh th bn t trc n mt k t \, v d bn c th in ra mn
hnh dng ch : Women's day ra mn hnh bng hai hm alert v document theo
cc cch sau
8y:alert("Women'sday"),document.write('Women\'sday');alert("Women\"sday");alert('Women"s
day'); v.v... V d 4: Ly (c) gi tr ca mt phn t HTML
To2phntnhtrongvd2bngthHTML,khingidngclickchutvont Welcome th hin th
ni dung cha trong text c tn l msg. Hng dn: ly gi tr ca mt phn t
HTML, bn vit .value V d: msg.value cho ta gi tr ca text tn l msg.
Gii mu: V d 5:Khai bo hm trong JavaScript v cch lin kt nt nhn vi mt
hm To 2 phn t nh v d 2, khi ngi dng nhn nt th gi mt hm c tn l
HienThi, hm hin th c chc nng hin th ni dung trong text c tn l msg
trn. Hng dn: Trong th to button, bn t thuc tnh onClick = "", trong
trng hp ny bn t OnClick = "HienThi()". iu ny c ngha l khi ngi s dng
Click chut (OnClick = Click chut) th trnh duyt hy gi hm HienThi().
Cng ging nh trong ngn ngC,Mthmbtbucphiccp ngoc n, cho d c tham
shaykhng.Vd khi gi hm HienThi th bn phi vit l HienThi(). Gii
mu:
function HienThi()// Khai bo mt hm tn l HienThi {
alert(msg.value);// Ly ni dung trong text box v hin th alert("Bn hy
nhp vo text v th li !"); }
Lu:TrongC,khaibomthmthngbnvit,vd:intHienThi()v...v..Tuy nhin, vi
JavaScript c hi khc t cht, thay vo bn vit function HienThi() Cn cc
cu lnh khc bn vit tng t nh ngn ng C hc. Cc hm khi khai bo trong
JavaScript bt buc phi t trong th ..... . V d 1: Cho ngi dng nhp vo
tn v tui. Hy vit li tn v tui ca ngi ra mn hnh bng hm
document.write, trong tn c mu m, tui c gch chn. 9Gii mu: var Ten,
Tuoi; // Khai bo 2 bin lu tn v tui Ten= prompt("Bn hy nhp vo tn ",
""); Tuoi = prompt("Bn hy nhp vo Tui : ", 20); document.write("Cho
bn : " + Ten + ""); document.write("
");// Xung dng document.write("Tui ca bn l : " + Tuoi + "");
Vd2:Tomtntnhn(button)cnamelwelcome,valuel"Welcome".Mt textbox c tn
l msg, value = "Welcome to". Hng dn : S dng phng thc (hm) write ca
i tng document to. Gii mu: document.write("Tao Button va Text bang
Script
"); document.write("
"); document.write(" "); document.write(""); V d 3: To mt nt nh
trong v d 2 v thm chc nng sau: Khi ngi dng click vo nt welcome th
hin th thng bo "Welcome to JavaScript !"
Hngdn:DngthtontnhnvthmthuctnhonClick=";"(TrongcthlmtlnhJavaScriptbtk,vd
lnh document.write, alert, prompt hoc lnh gi hm v.v...) Gii mu: Lu
quan trng: Trong JavaScript, mt hng xu c bao bi cp nhy n hoc nhy
kp, v d cc xu: 'nhy n',"nhy kp" l nhng xu hp l, tuy nhin bn vit :
'abc" hay "xyz'lnhngxukhnghpl.Trongtrnghpbnmuninchnhbnthndunhy n
hoc nhy kp ra mn hnh th bn t trc n mt k t \, v d bn c th in ra mn
hnh dng ch : Women's day ra mn hnh bng hai hm alert v document theo
cc cch sau
y:alert("Women'sday"),document.write('Women\'sday');alert("Women\"sday");alert('Women"s
day'); v.v... 10 V d 4: Ly gi tr ca mt phn t HTML
To2phntnhtrongvd2bngthHTML,khingidngclickchutvont Welcome th hin th
ni dung cha trong text c tn l msg. Hng dn: ly gi tr ca mt phn t
HTML, bn vit .value V d: msg.value cho ta gi tr ca text tn l msg.
Gii mu: V d 5:Khai bo hm trong JavaScript v cch lin kt nt nhn vi mt
hm To 2 phn t nh v d 2, khi ngi dng nhn nt th gi mt hm c tn l
HienThi, hm hin th c chc nng hin th ni dung trong text c tn l msg
trn. Hng dn: Trong th to button, bn t thuc tnh onClick = "", trong
trng hp ny bn t OnClick = "HienThi()". iu ny c ngha l khi ngi s dng
Click chut (OnClick = Click chut) th trnh duyt hy gi hm HienThi().
Cng ging nh trong ngn ngC,Mthmbtbucphiccp ngoc n, cho d c tham
shaykhng.Vd khi gi hm HienThi th bn phi vit l HienThi(). Gii
mu:
function HienThi()// Khai bo mt hm tn l HienThi { alert(msg.value);// Ly ni dung trong text box v hin th alert("Bn hy nhp vo text v th li !"); } Lu:TrongC,khaibomthmthngbnvit,vd:intHienThi()v...v..Tuy nhin, vi JavaScript c hi khc t cht, thay vo bn vit function HienThi() Cn cc cu lnh khc bn vit tng t nh ngn ng C hc. Cc hm khi khai bo trong JavaScript bt buc phi t trong th ..... . 11Chng II: S dng cc lp x l Chui, Ngy thng, Ton hc. Mc tiu: Kt thc bi hc ny, ngi hc c th. M t c cng dng ca cc lp x l Chui (String), x l ngy thng (Date) v x l cc hm ton hc Math. S dng c mt s phng thc, thuc tnh c bn ca cc lp ny. Vn dng vit mt s trang web n gin c s dng n 3 lp trn. Ni dung: Bi tp 1: Minh ho cch khai bo v s dng i tng Date ngy gi ca h thng. Yu cu: Hy hin th ngy v gi ca h thng my tnh khi trang Web c np. Thng tin hin th ra c dng nh sau: Hngdn:SdngitngDatevsdngcchmlyth,ngy,thng,nmin thng tin ra mn hnh. Ch n cc hm tnh thng, ngy trong tun b ht mt n v. Bi tp 2: Minh ho s khai bo v dng i tng Date ly Gi, pht, giy ca h thng Yu cu: Hin th Gi v pht trong thanh tiu ca ca s khi trang Web c np. Hng dn: Gi tr hin th trong thanh tiu ca trang web c lu trong thuc tnh title caitngdocument,dovyhinththngtintrnthanhtiu,bncnvit: document.title=.Vd,hinthdngch"HelloEverybody!",bnvit: document.title "Hello Every body !" Minh ho: var D = new Date(); document.title = "By gi l: " + D.getHours()+" gi "+ D.getMinutes()+ " pht.";
Bi 3: Vn dng bin i tng Date tnh tui ca mt ngi. Yu cu : Cho ngi dng nhp vo nm sinh ca h, sau hin th tui tng ng. Hngdn:SdngitngDatelynmhinti.Tuisbngnmhintitri nm sinh va nhp vo. Minh ho mu: Tnh tui Hm nay l th 2, ngy 13 thng 9 nm 2004 12var D = new Date(); var NamSinh, NamHienTai; NamHienTai = D.getYear(); // Lu nm hin ti vo binNamSinh = prompt("Bn sinh nm bao nhiu ? : ",""); alert("Tui ca bn by gi l : " + (NamHienTai-NamSinh));
Bi 4: Tng t nh bi 3 nhng Nm sinh nhp vo khng c ln hn nm hin ti. Hng dn: S dng vng lp dowhile yu cu nhp li nu nm sinh > nm hin ti. Minh ho mu: Tinh tuoi var D = new Date(); var NamSinh, NamHienTai; NamHienTai = D.getYear(); //Lu nm hin ti vo bin do { NamSinh = prompt("Bn sinh nm bao nhiu : ",""); } while (parseInt(NamSinh)>NamHienTai);//Nhp li nu Nm sinh>nm hin ti alert("Tui ca bn by gi l : " + (NamHienTai-NamSinh));
Bi 5: Minh ho cch t cc cu lnh JavaScript vo trong cc phn t HTML thc thi khi ngi dng click chut v s dng hm open ca i tng window m trang web. Yucu:VitonScriptchongidngnhpvomtsnguyn.Nungi dngnhps1thmtrangWebhttp://www.vnn.vn,nunhps2thmtrang http://www.mail.yahoo.com,nunhps3thmtranghttp://www.echip.com.vn, cn nu nhp mt s khc vi 1, 2 hay 3 th m trang http://www.google.com.Hng dn: m mt trang Web bt k trong ca s hin hnh bn vit nh sau: window.open("a ch ca trang cn m"). V d : window.open(http://www.vnn.vnn) m trang ch ca VNN trong ca s hin ti. Nhvy,giiquytyucucabitontrn,bncnchongidngnhp vo mt s v s dng cu trc switch kim tra v m trang web tng ng. Minh ho mu: M trang web vi hm open ca i tng window var LuaChon; LuaChon = prompt("Bn hy nhp vo mt s m trang web : ", 1); switch (LuaChon) { case "1" : window.open("http://www.vnn.vn"); break; case "2" : window.open("http://www.mail.yahoo.com"); break; case "3" : window.open("http://www.echip.com.vn"); break; 13default: window.open("http://www.google.com"); }
Bi s 6: Minh ho vic khai bo v s dng bin i tng Array lu tr danh
sch v cch s dng cc hm ca i tng Array nh hm sort v vng lp forin
Yucu:Chongidngnhpvodanhschtncamtlp,sauspxptheovn Alphabet ri hin th
danh sch sp xp ra mn hnh, mi ngi trn mt dng. Hng dn: S dng vng lp
for cho php nhp danh sch h tn v Lu danh sch vo mt mng, sau s dng
phng thc sort ca i tng mng sp xp, tip theo dng vng lp forin in cc
phn t trong danh sch. Minh ho mu: Sp xp mng var SoLuong, x; var DS
= new Array(100);// Khai bo mng DS, c th lu ti a l 100 phn t
SoLuong = prompt("Bn cn nhp bao nhiu ngi : ", 5); for (i=0; i <
SoLuong; i++) { DS[i] = prompt("Nhp vo h tn : ",""); } // Gi hm
sort ca i tng mng DS sp xpDS.sort(); //Hin th kt qu sau khi sp
(sort)document.write("Danh sch sp xp l "); for (x in DS)/* Nn s dng
cu trc for in ny duyt mng */ { document.write( DS[x] );
document.write("
");// Xung dng }
*** Nhn xt: Nu mun sp theo chiu gim dn th sau khi sort bn gi hm reverse. Bi s 7: Minh ho vic a cc cu lnh JS vo trong mt th khi ngi dng click chut.Yu cu: To mt nt nhn (Button) c name = "DangKy", value = "ng k". Khi ngi dng Click vo nt ny th thng bo l "ng k dch v E-Mail". Hngdn:iviccphntHTML,nhtextbox,button,checkbox,Selectv.vCc trnhduyt uchophp tathc thi mt hoc nhiu cu lnh JavaScript khi ngi s dng click chut ln cc phn t . Vn ch, vit cc cu lnh nh th no ? vit cc cu lnh JavaScript khi ngi dng click chut ln mt phn t no , trong th ca phn t ny, ta vit nh sau: OnClick = "Cc cu lnh JavaScript".14"CcculnhJavaScript"ylbtkculnhJavaScriptnovchngphi c cch nhau bi du chm phy. Ngoi ra, cc cu lnh phi t trong cp du nhy kp (Hoc nhy n). V d mt s cch a cu lnh JavaScript cn thc thi khi ngi dng clickchut 1.Onclick = "alert('Hello world';" 2.OnClick = 'document.write("Welcome to JavaScript");' 3.OnClick = "var x,y; x = 10; y = 20; alert('Tng l : ' + (x + y)); " 4.OnClick = "var Tuoi; Tuoi = txtTuoi.value; KiemTra(Tuoi);" 5.OnClick = "KiemTra();" Theo v d trn, Khi ngi s dng Click : 1 : Thc hin cu lnh alert('Hello world') 2 : Thc hin cu lnh document.write('Welcome to JavaScript'); 3 : Thc hin NHIU cu lnh JavaScript4 : Thc hin nhiu cu lnh JavaScript v c li gi n hm KiemTra(Tuoi) 5 : Thc hin cu lnh gi hm KiemTra(). Minh ho mu: Minh ho a cu lnh JavaScript vo cc phn t Bi s 8: Minh ho cch thay i thuc tnh ca mt i tng thng qua vic vit cc cu lnh JavaScript. To mt nt c name = ThayMauNen, value = "Thay i mu nn". Khi ngi dng click chut vo nt ny th thay i mu nn ca trang Web thnh mu "xanh".Hngdn:thayimunncatrangWebthnhmu,tacnthayithuctnhdocument.bgColor= "blue". (Mu l red, tm : magenta, en: black, trng: white, vng: Yellow, tm nht: lavender). Nh vy, cu lnh ny s c t trong phn onClick nh sau: Thay mau nen bang click chuot Thay i mu nn s dng i tng document 15Bi s 9: Minh ho vic c gi tr trong phn t text v hin th ra mn hnh Yu cu: To mt hp text c tn l HoTen. Mt nt c tn l HienThi, value = "Hin th".KhingidngclickvontHienThithhinthnidungtronghptext bng hm alert. Hng dn: ly gi tr ca mt phn t HTML no , chng ta vit.value Trong : chnh l gi tr ca thuc tnh name khi bn to th. V d : - Hoten.value, DangKy.value, GioiTinh.value, Password.value v.v Minh ho : c gi tr trong hp text Hy g vn bn vo trong hp text v click vo nt Hin th Lu:KhimunlygitrcaphntnobngJavaScriptthbnphitchon mtcitn,nhvdtrn,lygitrtronghptexttatchohptextnytn (name) l HoTen. Bi s 10: Minh ho vic thay i gi tr ca hp textbox Yu cu: To ra ba hp text ln lt tn l SoHang1, SoHang2, KetQua v mt nt c tn l TinhTong, thc hin php tnh tng. Khi ngi dng nhp hai s hng vo hp SoHang1 v SoHang2, sau click vo nt TinhTong th kt qu tng s c lu vo trong hp text KetQua. Hng dn: thay i gi tr mt thuc tnh no ca phn t HTML, bn vit theo cch sau: . = Trong : Tn phn t chnh l gi tr ca thuc tnh name khi bn to th. V d: HoTen.value = "y l vn bn mi", DangKy.value = "Sign Up now", v.v Thay i gi tr ca thuc tnh Hy nhp hai s v click vo nt Tnh tng + =
Lu :- Gi tr lu trong hp text lun l mt xu, do vy thc hin php cng
c ng, bn cn phi chuyn gi tr sang dng s bng hm parseFloat (Hoc
parseInt) nh trn. - Vic thay i ny c th p dng cho cc phn t khc nh
button, checkbox, v.v 16 Bi tp 11: Minh ho vic gi hm khi ngi dng
click vo mt ntYu cu: To ra 4 text c tn ln lt l : MauNen, MauChu,
TieuDe, TrangThai v mt nt c tn l ThayDoi, value l "Thay i". Khi ngi
dng click vo nt ThayDoi th mu nn, mu ch, tiu ca ti liu v thanh trng
thi ca ca s trnh duyt s c thay i bng cc gi tr trong text tng ng Hng
dn: Bn hon ton c th vit nhiu cu lnh trong thuc tnh OnClick nh cc v
d trc, tuy nhin nu c nhiu lnh th chng trnh trng khng c sng sa cho
lm. Khi bn c th nhm cc cu lnh vo trong mt hm v trong thuc tnh
OnClick bn ch vic gi hm ny ra. Minh ho mu Thay i thuc tnh ca trang
Web function CapNhat( ) { document.title = TieuDe.value;/* Thay i
tiu ca trang Web */ document.bgColor = MauNen.value;/* Thay i mu nn
ca trang */ document.fgColor = MauChu.value;/* Thay i mu ch ca
trang */ window.defaultStatus =TrangThai.value; /* Thay i dng trng
thi ca ca s */ } Nhp vo cc gi tr v nhn nt Thay i
Nhn xt: v d trn, khi ngi dng click chut ln nt ThayDoi th hm
CapNhat( ) s c gi. Thanh tiu ca ca s Thanh trng thi ca ca s 17i tng
String Bt k mt bin xu hoc mt hng xu u c coi l mt i tng xu. V d ta
c: var s = "Hung Yen-Aptech", "JavaScript" hay var x = new
String("Welcome to Aptech") th bin s, x v hng "Hng Yn - Aptech" l
cc i tng xu v u c cc phng thc v thuc tnh di y. Tn thuc tnh nghaV d
Thuc tnhlengthCho bit di ca mt xu x var x = "abc"; alert(x.length);
// 3 alert("Aptech".length);// 6 Tn phng thc nghaV d charAt(n)Cho
ta k t ti v tr: nalert(s.charAt(0)); //H indexOf(x) Cho ta v tr xut
hin ca xu s trong xu s. Nu khng thy th v tr tr v l -1.
s.indexOf("Aptech") -> 9 "Hello".indexOf("e") -> 1
"Java".indexOf("C") -> -1 lastIndexOf(x) Cho ta v tr cui cng ca
xu x trong xu s s.lastIndexOf("n") -> 7 "Hello".lastIndexOf("l")
-> 3 substring(n1, n2)Ly ra mt xu con trong xu s, ly t v tr n1 n
n2 (s k t ly ra l n2-n1 k t) s.substring(0,3) -> "Hun"
s.substring(2,4) -> "ng" "Hello".substring(2,5) ->"llo"
toLowerCase() Chuyn xu s thnh ch thng s.toLowerCase() -> "hung
yen-aptech" "Hello".toLowerCase()->"hello" toUpperCase() Chuyn
xu s thnh chHOA s.toUpperCase() -> "HUNG YEN-APTECH"
"Hello".toUpperCase() -> "HELLO" big()In to xu s
document.write(s.big()) document.write("abc".big()) bold()In m xu s
document.write(s.bold()) document.write("abc".bold()) fontcolor(m)
In xu s vi mu m. v d mu: "red", "blue" m"magenta" v.v..
document.write(s.fontcolor("blue"))
document.write("abc".fontcolor("red")) fontsize(n)In xu s vi kch c
font l n document.write(s.fontsize(30))
document.write("Java".fontsize(20)) strike() In xu s vi ng gch
ngang document.write(s.strike()) sub()In xu s di dng hin
tidocument.write(s.sub()) document.write("H"+"2".sub()+"O")//H2O
sup()In xu s trn dng hin ti document.write(s.sub())
document.write("x" + "2".sup());// -> x2 anchor(A) To mt im neo,
c tn l A, phn hin th l s. document.write(s.anchor("TOP")) Phng thc
link(A) To mt lin kt n im neo A, phn hin th l s
document.write(s.link("#TOP")) document.write("V u
trang".link("#TOP")) i tng Math Vi i tng Math, Khi khai bo bin thuc
i tng ny, bn khng c vit dng nh : varm = new Math(); Khi mun s dng
cc thuc tnh v phng thc ca i tng ny
bngitrctipccthuctnhvphngthc,vd:Math.sin(3.14),Math.PI, Math.abs(x)
v.v... Tn thuc tnh nghaV d PICho ta hng s PI (tc 3.14159) var
BanKinh = 10; alert("Din tch hnh trn l :" + Math.PI *
BanKinh*BanKinh); Thuc tnh ECho ta hng s E (= 2.718)alert("Hng s E
l: " + Math.E) 18SQRT2 Cho ta cn bc 2 ca 2 : (=1.4142) alert("Cn bc
2 ca 2 = " + Math.SQRT2); SQRT1_2 Cho ta (cn bc 2 ca 2) / 2
alert("Cn bc 2 ca 2 /2 = " + Math.SQRT1_2); Tn phng thc nghaV d
abs(x)Cho ta tr tuyt i ca x alert(Math.abs(-19)); // -> 19
alert(Math.abs(-1.5));// -> 1.5 sin(x), cos(x)Tnh sin v cos ca x
alert("Sin(1.5) = " + Math.sin(1.5)); alert("Cos(0) = " +
Math.cos(0)); sqrt(x)Tnh cn bc hai ca xalert("Cn 16 = " +
Math.sqrt(16)); //4 pow(x,y)Tnh xy
alert("6^2="+ Math.pow(6,2)); //->36 alert("9^0.5="+
Math.pow(9,0.5));//3 round(x) Lm trn s x. Nu phn l sau phn thp phn
> = 0.5 th b phn thp phn v cng thm 1. Tri li th b phn thp phn
nhng v khng cng g alert(Math.round(3.5));//->4
alert(Math.round(3.6));//->4 alert(Math.round(3.49));//->3
max(a,b) Cho ta gi tr ln nht trong hai s a v b var a = 10, b = 100;
alert("Max(a,b) = ",Math.max(a,b)); //100
alert(Math.max(-1,2));//->2 min(a,b) Cho ta gi tr nh nht trong
hai s a v b var a = 10, b = 100;
alert("Min(a,b)=",Math.min(a,b));//10
alert(Math.min(-1,2));//->-1 ceil(x) Lm trn s x, Nu s x c phn
thp phn th phn thp phn b ct i sau cng thm 1 vo x var x = 1.1, y =
2.5, z = 4.8; alert(Math.ceil(x), Math.ceil(y),Math.ceil(z)); //
->235 Phng thc floor(x) Lm trn s x, nu x c phn l thp phn th b ct
i, ch ly phn nguyn. var x = 1.1, y = 2.5, z = 4.8;
alert(Math.floor(x), Math.floor(y),Math.floor(z)); // ->124 i
tng Date Khai bo bin thuc i tng Date nh sau: var = new Date(); V d
ngy, gi hin ti l th hai 20/12/2004, 6h30' 20'', ta c cc kt qu sau:
Tn phng thc nghaV d getDay() Ly th hin ti trong tun (Ch nht ng vi
0, th hai ng vi 1, ..., th 7 ng vi 6) var D = new Date();
alert(D.getDay()); //-> 1 getDate()Ly ngy hin
tialert(D.getDate()); //->20 getMonth() Ly thng hin ti
(0->thng 1, 1-> thng 2) alert(D.getMonth()); //->11
getYear()Ly nm hin tialert(D.getYear());//->2004 getHours()Ly gi
hin ti (Tnh theo 24 h)alert(D.getHours());//->6 getMinutes()Ly
pht hin ti alert(D.getMinutes());//->30 getSeconds()Ly giy hin
tialert(D.getSeconds());//->20 setDate(n)t ngy l n
D.setDate(10); alert(By gi: +D.getDate()); //10 cc phng thc
setYear(n), setHours(n) cng lm tng t. Ch , s n phi l s nguyn. v vic
set ch lm thay i gi tr ngy, thng nm, gi, pht, giy ... ca i tng Date
ch khng lm thay i ngy gi ca h thng my tnh. 19Chng III: X l s kin
trong trang HTML vi JavaScript Mc tiu ca chng: -Gip hc vin nhn bit
c khi no s kin xy ra -Vit cc cu lnh JavaScript t vo cc s kin khi n
xy ra -Vn dng linh hot vo vit chng trnh Ni dung: 1.Nhc li khi nim s
kin (event) S kin l nhng hnh ng do ngi dng hoc h thng gy ra. Cc hnh
ng do ngi dng gy ra c th l di chuyn chut, nhn chut, nh chut, nhn
phm, nh phm, copy, ko gin ca s, di chuyn ca s v.v... Cc s kin do h
thng gy ra c th l np ti liu, ng ca s v.v... Khi s kin xy ra, n s t
ng thc thi cc cu lnh JavaScript tng ng vi s kin (nu chng ta nh ngha
chng trnh x l s kin tng ng). 2.Bng lit k cc s kin v tn tng ng Mi s
kin khi xy ra chng u c mt ci tn v thng bt u bng t on, v d nh
onClick, onChange.... c th c m ta nh trong bng di y: Tn S kinCh p
dng cho phn t M t onabortImagec kch hot khi ngi s dng hu b vic ti
mt hnh nh bng cch kch vo mt kt ni hoc nt Stop onblurWindow, frame,
all form elementKhi phn t b mt focus onclickButton, radio button,
check box, submit button, reset button, link c kch hot khi ngi s
dng kch tri chut vo phn t. onchangeText field, textarea, select
listN c kch hot khi ngi s dng thay i gi tr ca phn t. onfocusWindow,
frame, all form elementN c kch hot khi ngi s dng t focus vo mt ca
s, khung, hay phn t form onloadDocument, applet, frameset,
img,link, object, script, style, window N c kch hot khi ti liu c
trnh duyt np xong. onmousedownButton, document, linkN c kch hot khi
ngi s dng n nt con chut onmouseoutArea, layer, linkN c kch hot khi
ngi s dng di chuyn con tr ra khi mt phn t. onmouseoverArea, layer,
linkN c kch hot khi ngi s dng di chuyn con tr khp mt phn t.
onmouseupButton, document, linkN kch hot khi ngi s dng nh nt con
chut c n. onresetFormKhi ngi s dng click vo nt reset form
onresizeWindow, frameN kch hot khi ngi s dng ko gin ca s hoc mt
khung. onsubmitFormN c kch hot khi ngi s 20dng click vo nt submit
ca form. onunloadDocument, frameset, image, windowN c kch hot khi
ngi s dng chuyn sang (m) mt trang khc. Vy p dng tn cc s kin lit k
trn nh th no ?
NubnbitkhinomtskinxyrathbnhoncththcthiccculnhJavaScript tng ng vi s
kin . C php khai bo trnh duyt thc thi cc cu lnh JavaScript khi mt s
kin xy ra nh sau: a/ Cch 1:
Lu:MtculnhJavaScriptcthlbtkculnhnombnhc.Culnhnyphi c t trong cp nhy
kp (hoc cp nhy n). V d1 : V d 2: V d 3: Hello ! V d 4: Ta hy i phn
tch v d 1. Trong v d ny ta to ra mt textbox v vit (khai bo) s kin
click nh sau : onClick = "alert('Bn click vo textbox');" y c 2 phn:
-Phn onClick : l tn ca s kin click chut (xin tham kho bng trn).
-Phnth2 saudu =,l mtculnhJavaScripttngngscthcthikhi s kin click
chut xy ra i vi textbox . y l cu lnh alert.
iunycnghal,btckhinongidngclickchutvotextboxnythtrnhduytst ng thc
thi cu lnh alert('Bn click vo textbox'); Kt lun: Nu chng ta mun
trnh duyt thc thi mt cu lnh no khi mt s kin xy ra th cn khai bo
trong phn nh ngha th nh sau: = "" Tng t trong v d 2: Bt c khi no
ngi dng di chuyn chut trong textbox (tn s kin l onMouseMove) th lnh
"alert('Bn di chut');" s c thc thi. Trong v d 3: Bt c khi no bn
click chut vo dng ch "Hello !" th thanh trng thi ca ca s s c dng ch
: "Vn bn b click chut" Trong v d 4: Theo bn, thng bo " c gi" khi no
th xut hin !? b/ Cch 2: Bn c th khng ch vit mt cu lnh khi mt s kin
xy ra i vi mt phn t no m JavaScript cn cho php bn thc thi nhiu cu
lnh ng thi, vi iu kin cc cu lnh ny phi c phn cch nhau bi du chm phy
";". C php vit nh sau: V d 1: Trong v d ny, ta to mt textbox v khi
ngi dng click chut vo textbox ny th trnh duyt s thc thi 2 cu lnh
tng ng nh ta ch ra trong th : window.status='Click chut' v
alert('Bn click chut'). 2 lnh ny c phn cch nhau bi du chm phy. V d
2:21 Trong v d ny ta cng to ra mt textbox v khi textbox ny nhn c
focus (click chut) th trnh duyt s t ng thc thi 3 cu lnh :
Hoten.value=' ' window.status='H tn nhn focus'
window.document.title = 'Ni dung trong textbox b xo' Nhn xt: Nu s
cu lnh cn thc thi khi mt s kin xy ra l t (Mt hoc hai cu lnh) th ta
c th khai bo on chng trnh x l s kin s dng theo cch 1 hoc cch 2. Cn
trong trng hp s cu lnh cn x l l ln, th cch nn s dng cch khc m ta s
cp di y. C/ Cch 3: Gi mt hm khi mt s kin xy ra. V bn cht cch ny
chnh l cch mt, c iu cu lnh l mt li gi hm. Cch ny thng c s dng khi :
S lnh cn thc thi khi mt s kin xy ra l ln m bo cho chng trnh sng sa
v d c, d qun l v bo tr C php khai bo hm trong nh ngha s kin nh sau:
V d:1/ 2/ 3/ Trong , Ham1(), GuiThongTin() v KiemTra() l cc hm. Tm
li: Tu vo trng hp c th m khi mt s kin xy ra, bn c th vit mt lnh,
nhiu lnh hoc mt hm tng ng s c thc thi trong nh ngha th. Tuy nhin,
mt qui tc chung l: Nu on chng trnh x l s kin ch c mt lnh th nn vit
theo cch a, cn tri li th nn vit cc lnh trong mt hm (tc theo cch vit
b). 3.Mt s bi tp minh ho V d 1: Hy to mt nt nhn (button) c value =
"Th". Khi ngi dng click vo nt ny th tiu ca ca s s l "Bn click chut"
Hngdn:Trchttacnxcnhxemcclnhnochophptathayitiucacas thnh "Bn click
chut", tip theo l t cc lnh vo u khi ngi dng click chut th n c thc
thi theo nh yu cu bi ton Lnh thay i tiu nh sau: document.title =
"Bn click chut"
NhtabitkhingidngclickthskinonClickxuthin,dovyculnhtrns c t tng ng
vo s kin onClick, nh sau: Hay click vao nut o duoi va quan sat tieu
de Vd2:TomttrangWeb,c2phnt:Phntbuttoncvalue="Gi",vmtphnt textbox.Yu
cu: khi ngi dng click vo nt Gi th thng bo trn mn hnh l : "Bn click
vo nt gi" cn khi ngi dng click vo textbox th thng bo l "Bn click vo
textbox". Hng dn: Theo yu cu ca bi th dng thng bo "Bn click chut vo
nt gi" xut hin ch
khingidngclickchutvontgi,dovycclnhthchinhinththngbosct
trongskinonclickcantnhn.Cndngthngbo"Bnclickchutvotextbox"khi ngi
dng click chut vo textbox, do vy cc lnh thc hin hin th dng thng bo
s c t trong s kin onclick ca textbox : Minh ho: 22 Hay click vao
nut va textbox o duoi va quan sat tieu de V d 3: To 2 nt, nt th nht
c value = "Xanh", nt th hai c value = "". Yu cu: Khi ngi dng click
vo nt xanh th mu nn ca ti liu l xanh (blue), cn khi ngi dng click
vo nt th mu nn ca ti liu l: (red).
Hngdn:ThuctnhmunncatiliuclutrongthuctnhbgColorcaitng document. Thuc
tnh ny c th thay i c. Minh ho: V d 4: To mt danh sch la chn gm c 4
mu: red, blue, brown v lavender. Khi ngi dng chn mt mu th mu nn ca
ti liu s thay i tng ng. Hng dn: thay i mu nn ca ti liu ta lm tng t
nh v d 3 Minh ho: function DoiMau() { document.bgColor = Mau.value;
// Hoc vit: window.document.bgColor = Mau.value; } Bn hy chn mu nn:
Mu Mu xanh Mu nu Mu xanh nht V d 5 : To mt textarea c tn l NoiDung,
mt Textbox c tn l : SoKyTu. Vi yu cu nh sau:
Khingisdnggccphmvotrongtextareathslngkt(dixu)chatrong textarea s c
hin th trong textbox. Nu s lng k t trong textarea g vo vt qu 200 k
t th thng bo : "Bn g qu s k t cho php !". 23 function KiemTra() {
if (NoiDung.value.length > 200) alert("Bn g qa s k t cho php
!"); SoKyTu.value = NoiDung.value.length; // Hin th s k t trong
textbox SoKyTu } S k t g :
vdtrn:Hmkimtrascgimikhiskinnhnphm(onKeyUp)xuthinhayni cch khc l khi
ngi dng g thm mt k t vo trong textarea. y ta khng t hm kim tra vo
trong s kin onClick; Mn hnh cho v d ny c dng nh sau: V d 6: To mt
nt c value = "Gi", textbox c name = "HoTen", 2 nt radio c tn l
GioiTinh v nhn tng ng l Nam, n.
Yucu:Khingidngdichuynchutvophntnothhinththngbotngngdi thanh trng
thi. V d nu ngi s dng di chuyn chut qua nt nhn "Gi" th thanh trng
thi s l "Bn ang dichuyn chut vo nt"... Hng dn: Khi ngi dng di chuyn
chut th s kin di chuyn chut s xut hin, s kin ny c tn l :
onMoseMove. Vy ta s vit lnh trong s kin ny. Minh ho: mn hnh 24 Xu
ly su kien
Nam N
V d 7:To 3 textbox, c tn ln lt l: SoLuong (S lng), DonGia (n gi)
v ThanhTien (Thnh tin);
Yucu:KhingidngnhpgitrtrongDonGiathktqusccpnhtngaytrong ThanhTien.
Hng dn: KhingidngnhpgitrtrongtextboxDonGiabngcchnhnccphmsths kin
nhn phm xut hin (s kin nhn phm c tn l onKeyUp), do vy ta s vit cc
lnh p ng vi s kin ny. Cc lnh y ch c mt do vy nn t ngay trong nh
ngha th, nh sau: Tinh tich Bn hy nhp vo s lng v gi: S lng: n gi:
Thnh tin: USD 25 V d 8: Tng t nh v d 7, nhng vit theo cch khai bo 3
(Cc lnh vit trong hm). Kt qu vn cho ta nh v d 7 Tinh tich function
TinhToan() { ThanhTien.value=SoLuong.value*DonGia.value; // Hoc bn
vit y l: // window.ThanhTien.value =
window.SoLuong.value*window.DonGia.value } Bn hy nhp vo s lng v gi:
S lng: n gi: Thnh tin: USD 26 V d 9: To ra mt trang Web ng nhp vo
trang Vinaphone cho php ngi gi tin nhn n in thoi di ng.
hngdn:ngnhpvomttrangWebno,nhngthngtinbtbucthngl UserName v password
(mt khu). Tuy nhin, ngoi nhng thng tin bt buc chng ta cn phi gi cc
thng tin ph. Nhng thng tin ph ny ngi dng ngi dng khng phi nhp. (cc
thng tin ph di y s c gch chn) Minh ho: Dang nhap vao trang
http://sms.vinaphone.vnn.vn ng nhp vo trang Web ca vinaphone User
NamePassword
27 Cc th c thuc tnh type = "hidden" s khng c hin th trong trnh
duyt, tuy nhin khi chng ta "Submit" th cc thng tin trong cng c gi
i. Cc bi tp t gii Bi 1: Hy to ra trang Web c giao din nh sau: Yu
cu:Khi ngi dng di chuyn chut n phn t no th hin th dng nhc di thanh
trng thi hng dn ngi dng. V d: Khi ngi dng a chut vo trong textbox
User Name 28th th hin th di thanh trng thi l :"Nhp m ngi dng", hay
khi ngi a chut n nt "ng k" th hin th dng nhc: "Gi thng tin i ng k"
v.v... Hng dn: Nt ng k nn l nt thng, tc l to bng th : Bi tp 2: C
giao din nh bi 1, nhng yu cu nh sau: Khi gi thng tin i, cn kim tra
xem ni dung ngi dng g trong Password vi textbox trong "G li
password" c ging nhau hay khng? Nu bng nhau th mi gi (Submit) i, cn
nu khng bng th thng bo l "Password phi ging nhau" Khi gi thng tin,
cn kim tra ngy sinh, thng sinh phi hp l. (Tc ngy phi nh hn 32, thng
phi nh hn 13) Hng dn: Nt ng k nn l nt thng, tc l to bng th : Trong
Hm DangKy() s kim tra d liu hp l v khi d liu nhp vo ng n th gi i
bng cch gi phng thc submit ca i tng document, nh sau:
document.submit(); Bi tp 3: Lm tng t bi tp 7 v 8, nhng thm yu cu:
Khi ngi dng nhp hoc s lng, hoc n gi th hy tnh lun textbox thnh tin.
Hng dn: Vit lnh tnh thnh tin trong c 2 s kin onKeyUp ca c hai
textbox s lng v textbox n gi.*** Lu : Trc khi tnh tch th cn phi kim
tra xem d liu trong hai textbox c hay cha, nu mt cha nhp g th cha
tnh. Chng IV: nh dng cc phn t HTML bng CSS Mc tiu ca chng: -Gip hc
vin hiu r hn v ngha ca vic dng kiu (style) -Tra cu thnh tho cc thuc
tnh trong bng dnh sch kiu -Vn dng cc thuc tnh (kiu) nh dng cho cc
phn t trong trang web, nng cao tnh thm m. Ni dung: I. Nhc li khi
nim v kiu Kiu (style) thc cht l mt cch nh ngha thuc tnh cho cc phn
t trong trang web theo mt cch thc mi.Vic nh ngha cc thuc tnh ny cho
cc phn t s cho ta mt "dng v mi", mt "din
momi"vtrangweb.Ngoira,vicnhnghathuctnhtheocphpminyslm tin cho vic
xy dng cc trang web ng m ta s cp trong cc chng tip theo. V d: Trc
y, nh ngha mt on vn bn nm trong th c font ch l .vntime, chng ta s
vit nh sau:
Trang ng k E-Mail
ng k Website min ph Trang dy JavaScript
Trang IT Ting vit i hc Bch khoa H Ni
i hc cn thi hc Quc gia Cc lin kt Tin tc Cc hot ng
Chng VI: Ni dung ng v nh v ng Mc tiu ca chng ny gip ngi hc c th: OThay i ni dung ca cc th trong trang web thng qua JavaScript OS dng JavaScript di chuyn cc tng OVn dng kh nng nh v ng v ni dung ng vo thit k web C.TM TT L THUYT 451. Ni dung ng l kh nng cho php thay i ni dung ca trang web bng cc lnh Script. thay i ni dung ca mt phn t no trong IE, chng ta c th thay i mt trong 4 thuc tnh ca n : innerText innerHTML outerText outerHTML C php dng thay i gi tr ca cc thuc tnh nh sau: document.all.. = Trong Click here Bi s 3: Minh ho thay th thuc tnh outerText. Yu cu: To mt nt c nhn l "Open". Khi ngi dng click vo nt ny th m trang http://www.echip.com.vn, trong mt ca s mivdngnt s thay bng dng ch "Trang ny m". Hng dn: m mt trang web trong mt ca s mi, bn vit: window.open("a ch URL ca trang cn m", "_Blank") Thay th nt bng mt dng ch thng qua thay i thuc tnh outerText ca nt. Minh ho: 47 function ThayDoi() { window.open("http://www.echip.com.vn","_blank"); document.all.Nut1.outerText='"Trang ny thm"; } Bi s 4: Minh ho thay i thuc tnh outerHTML Yu cu: To mt dng ch "Click here" c mu xanh, kch c H1. Khi ngi dng click vo dng ch ny th thay bng mt lin kt n trang http://www.vn.vn Hng dn: Do y khi ngi dng click vo dng ch th thay th bng mt lin ktnnthuctnhcnthayislouterHTML.Culnhthayisct trong s kin Click chut. Minh ho: function ChenLienKet(){ document.all.LienKet.outerHTML='Trang Aptech' ; } Click Here Bi s 5: Minh ha vic nh v ng trong IE Yucu:Tomtntcnhnl"SignUp".Khichutdichuyntrongntnyth hin th dng nhc l "ng k hm th mi" c mu nn l vng ti v tr ca con chut. Khi chut di chuyn ra ngoi th dng nhc n i. Hngdn:Bntoramttngchadngch"ngkhmthmi"cmu nn l vng. Khi chut di chuyn n (onMouseMove) th t thuc tnh visibility l 'visible' cho hin tng v khi di chuyn chut ra ngoi (onMouseOut) th t li thuctnhvisibilityl'hidden'ntng.Lu,vtrcachutclutrong thuc tnh event.clientX v event.clientY. Bn s gn v tr ny ca chut cho 2 thuc tnh pixelLeft v pixelTop nh v tng. Minh ho:48 function HienThi(){ document.all.Tang1.style.pixelLeft = event.clientX; document.all.Tang1.style.pixelTop = event.clientY; document.all.Tang1.style.visibility = 'visible'; } function AnTang() // n Tng Tang1 { document.all.Tang1.style.visibility = 'hidden'; } ng k hm th mi Kt qu khi chut di chuyn vo trong nt Bi s 6: Minh ho ni dung trong Netscape Yu cu: To mt tng c tn l Tang1, mt nt nhn c nhn l "Np trang Web" v mt hp text c tn l DiaChi. Khi ngi dng nhp a ch vo trong hp text v nhn nt "Np trang web" th ni dung ca trang s c np vo tng Tang1. Hng dn:- Dng th LAYER to tng v t tn cho n l Tang1 - Vit trong s kin onCLick ca nt "Np trang web" cu lnh np ti liu vo tng. C php np ti liu vo mt tng trong Netscape nh sau: document..src = "a ch trang cn np" Trong trng hp ny s l : document.Tang1.src = document.form1.DiaChi.value Minh ho: Hin th tooltip 49 Tng ny dng hin th trang Web bn g trong hpText !
C. BI TP T GII Bi s 1: To mt tng c cha dng ch "Hello", kch thc
H1. v mt nt nhn c nhn l "Thay i". Khi ngi dng click vo nt ny th yu
cu ngi dng nhp vo mt xu, sau thay ni dung trong
thH1bngxunhpvony(Theo4cch:thaythuctnhinnerText,innerHTML,outerText,
outerHTML). Bi s 2: To mt th H1, mu ch xanh dng hin th thi gian ca
h thng (gm gi:pht:giy).Gi : Vit hm CapNhat ly gi:pht:Giy trong my
tnh sau gn cho thuc tnh innerText ca th H1. S dng hm
setInterval("CapNhat();", 1000) lin tc cp nht thi gian theo tng
giy. Bi s 3: To 2 tng trong IE, mi tng cha mt bc nh. Tng th nht chy
t tri sang phi mn hnh, tng th hai chy t trn xung di mn hnh.Gi : S
dng 2 hm setInterval gi 2 hm di chuyn 2 tng. Bi s 4: To mt tng cha
3 lin kt. Chut click ti v tr no th tng s c t ti v tr . Gi : Vit lnh
trong s kin onClick ca th BODY. Bi s 5: To mt form ng k E-Mail tng
t nh ca Yahoo (Bn ch cn to
mtsphnt,khngcntoht).Mikhingidngdichuynchutnmt phn t no th hin th mt
li ch thch bng Ting vit. (Xem Bi s 5) Bi s 6: To 3 tng (Trong
Netscape), mi tng np mt trang tng ng nh sau: http://www.vnn.vn,
http://www.echip.com.vn v http://www.manguon.com.
Bis7:Tomttngchamtbcnh,mtntcnhnl"Dichuyn".Khi
ngidngclickvontnythbcnhsdichuynchotgctrnbnphi xung gc di bn tri ca
mn hnh. Gi : Tng dn pixelTop, gim pixelLeft. Bi s 8: Hy lm ht cc bi
tp trong sch gio khoa ca cun gio trnh HTML, DHTML & JavaScript.
50Phn B : ASP I. ASP l g ? 1. Gii thiu ASP ASP l mt ngn ng kch bn
dng xy dng cc ng dng trn mi trng internet. Nh
tngican,ASPgipngixydngngdngwebtoracctrangwebcnidung
linhhot.Viccngidngkhcnhaukhitruycpvonhngtrangwebnycths
nhncccktqukhcnhau.Nhnhngitngcsn(Built_inObject)vkh
nnghtrccngnngscriptnhVBScriptvJscript,ASPgipngixydngng
dngddngvnhanhchngtoracctrangwebchtlng.Nhngtnhnngtrngip
ngiphttrinngdngnhanhchngtipcnngnngmi,iunylmtuim khng nh ca ASP. 2.
C ch hot ng
KhimttrangASPcyucubiwebbrowser,webserversduyttunttrangASP ny v ch
dch cc script ASP. Ty theo ngi xy dng trang web ny quy nh m kt qu
dowebserverdchstrvlnltchotrnhduytcangidnghaylchtrvkhi dch xong tt c
cc script. Kt qu tr v ny mc nh l mt trang theo cu trc ca ngn ng
HTML. C ch hot ng i vi cc trang web thng. 51 C ch hot ng i vi cc
trang web ng (ASP chng hn). 523. u v nhc im ca ASP u im :-ASP b
sung cho cc cng ngh c t trc nh CGI (Common Gateway Interface), Gip
ngi dng xy dng cc ng dng web vi nhng tnh nng sinh ng. Tuy nhin, khc
vi CGI, cc trang ASP khng cn phi hp dch.-D dng tng thch vi cc cng
ngh ca MicroSoft. ASP s dng ActiveX Data Object (ADO) thao tc vi c
s d liu ht sc tin li.-Vi nhng g ASP cung cp, cc nh pht trin ng dng
web d dng tip cn cng ngh ny v nhanh chng to ra cc sn phm c gi tr.
iu ny ht sc c ngha trong iu kin pht trin nh v bo ca tin hc ngy nay.
N gp phn to nn mt i ng lp trnh web ln mnh. -ASP c tnh nng m. N cho
php cc nh lp trnh xy dng cc component v ng k s dng d dng. Hay ni
cch khc ASP c tnh nng COM(Component Object Model) Khuyt im : -ASP
ch chy vtng thch trn mi trng Window iu ny lm ASP b hn ch rt nhiu.
-Dng ASP chng ta s gp khng t kh khn trong vic can thip su vo h thng
nh cc ng dng CGI. -ASP khng c s h tr nhiu t cc hng th ba. -Cc ng
dng ASP chy chm hn cng ngh Java Servlet. -Tnh bo mt thp. Khng ging
nh CGI hay Java servlet, cc m ASP u c th c c nu ngi dng c quyn truy
cp vo web server. C l y l l do quan trng nht ngi dng khng chn cng
ngh ASP. II. Cu trc ca mt file ASP 1. Cu trc tng qut Cc th HTML. Cc
th HTML. Cc th HTML. Cc th HTML. 53 2. Mt s lu : -Phn m rng ca file
phi l ASP -C th vit nhiu on trong mt file aSP -Trong on phi l cc cu
lnh asp, khng c cha cc th. Nu mun in Cc th- a vo cu lnh
response.write. -Cc cu lnh nm trong phn l cc cu lnh vit ging nh
Visual Basic.(Vng lp for, do while, do loop, cc hm nh Left, right,
month, abs, year, mid, ..s dng ging nh trong VB) - "READ" trong ASP
s dng i tng REQUEST - "WRITE" trong ASP - S dng i tng RESPONSE III.
Cc i tng Server 1. i tng Response 1.1. Chc nng (Chnh) Dng tr
(write) kt qu v cho my khch (Trnh duyt) 1.2. Mt s phng thc dng:
1.2.1 Phng thc write Vit kt qu tr v cho trnh duyt (my khch). + C
php :Response.write(/) Trong l mt xu k t, c th cha cc th HTML. Biu
thc c th l hng, bin, hm, biu thc cha c hng, bin, hm . +V d: Gi xu
Hello world v cho trnh duyt. Tng ng vi: Hello world 541.2.Phng thc
Redirect Hngngidngsangmttrangwebkhc.Vdkhingidngg
www.abc.com/Trang1.asp th chng ta c th hng (m) sang trang
Trang2.asp hin th. + C php: Response.Redirect URL (a ch/ siu lin
kt) + V d:KhingidngnhpvotrangTrang1.asp,tashin
thtrangTrang2.Asp.Khi ni dung ca trang1.asp s nh sau: Redirect ....
Bn phi thm trang2.asp trc !
Mt v d cn s dng n phng thc ny l, khi ngi dng cha thc hin ng nhp v
vo ngay trang thao tc vi CSDL th ta cn redirect n trang ng nhp. 2 i
tng Request M hnh nhp liu t ngi dng v tipnhn d liu ca webserver: 2
con ng. 1. POST: Gi c mt form nhp d liu ti webserver 2. GET : Gi
thng qua lin kt URL 2.1. Chc nng Nhn (ly / c) v cc gi tr khi ngi
dng Submit (gi) i. (V d khi ngi dng in
ccthngtinngktikhonvnhnvontSubmitththngtinscnhnv thng qua i tng
Request). C hai cch ngi dng gi thng tin i C 2 cch tng ng tip nhn
(c) . Cch1:Ngidngnhpthngtintrongcctextbox,saugiccthngtintrongcc
textbox ny ti mt trang asp khc. Khi ngi ta gi cch gi l gi theo kiu
POST. Cch 2: Thng tin c th gi ti mt trang khc bng cch gn vo sau mi
URL ca trang . V d gi hai thng tin l HoTen v Tuoi vi gi tr tng ng l
TK34 v 2 cho trang XuLy.asp th c th thc hin nh sau:
XuLy.asp?HoTen=TK34&Tuoi=2 C php gn vo sau trang nhn nh sau:
TrangNhan.asp ? Thuc_Tnh 1 = Gi tr1 & Thuc_Tnh 2 = Gi tr 2
& . Cch gi ny gi l phng thc gi kiu GET 552.2. Mt s thuc tnh v
phng thc thng dng 2.2.1 Thuc tnh Form Dng ly gi tr ca tng thuc tnh
m trang khc gi ti bng phng thc POST C php:
Request.Form(Tn_Thuc_Tnh_Cn_Ly) V d: Trang1.asp c 2 textbox tn l
HoTen v Tuoi. cho php ngi dng nhp vo v
khingidnggii(Submit)titrangTrang2.asp.thtrang2.aspshinthlichoti ngi
. Ni dung 2 file ny s nh sau: Trang1.asp Gi d liu sang trang khc
Trang nhp thng tin :
H v tn :
Tui :
Trang2.asp Nhn d liu gi t trang khc Ch : + Mun gi thng tin trong cc
iu khin (cc textbox, textarea, checkbox, list) i th cc iu khin phi
t trong mt Form (cp th . ) no . 56+ Trang web tip nhn thng tin s c
t trong thuc tnh Action ca Form. + Phng thc gi i c ch nh thng qua
thuc tnh method. t cho thuc tnh ny gi tr hoc l POST hoc l GET.
+Mttrangcthgi(Post)nchnhtrang.iunythngcpdngkhini dung trang web l n
gin (v d trang Login), cn i vi cc trang phc tp (nhiu x l) th nn gi
n mt trang ring. V d 2: Cho ngi dng nhp vo nm sinh, sau tnh ton v
hin th tui ca ngi .
Cchthcyl:Trangchongidngnhpnmsinhvtranghinthktqul ging nhau. Trang
TinhTuoi.asp- Version 1 Tinh tuoi Trang TinhTuoi.asp- Version 2
Tinh tuoi Nhap nam sinh cua ban : 57 Version 3 S dng cc trang x l
ring bit -tng:Tatchlm2trang,mt trang "Chuyn" hin th form nhp nm
sinh, sau gi ti mt trang "chuyn" x l v hin th kt qu. -Trang hin th
form nhp do khng c x l g, do vy ta ch cn to trang l trang HTM thng
thng NhapNamSinh.htm. -Trang x l do phi dng cc cu lnh ASP nn ta s
to trang ASP- TinhTuoi.asp Trang NhapNamSinh.htm Nhap nam sinh Nhap
nam sinh cua ban : Trang TinhTuoi.asp Tinh tuoi Cch (version) no d
dng hn i vi bn ? 3 version c u v nhc im g ? rt KL ! 581.2.2 Thuc
tnh QueryString DngcdliudotrangkhcgitithngquaphngthcGET(Thnglgid
liu bng cch gn vo ngay sau lin kt - URL). + C php c d liu gi n thng
qua phng thc ny nh sau: Request.QueryString("Tn_Thuc_Tnh_Cn_Ly") +
V d 1 : Gi ti trang TinhTuoi.ASP nm sinh (t tn l NamSinh) c gi tr l
1980 dng GET.Khi , Hyperlink gi i c dng :
http://www.tk34.com/TinhTuoi.asp?NamSinh=1980 Dng a ch trn c th tm
dch l "Gi mt thng tin c tn l NamSinh vi gi tr 1980 n trang
TinhTuoi.ASP Ch : gi d liu theo kiu GET th c th gi bng cch g trc
tip vo hp a ch (address) ca trnh duyt hoc c th xy dng mt trang
ring, sau mi gi. tip nhn v x l d liu ny, ni dung trang TinhTuoi.asp
s nh sau: TinhTuoi.asp - Version 1 Tinh tuoi Vi phin bn ny, r rng
khi mun gi d liu cho mt trang chng ta phi g mt cch th cng ! C th gi
theo cch ny nhng d dng c hn khng ? V d nh cho ngi dng nhp vo cc
textbox chng hn ? TinhTuoi.asp - Version 2 Tinh tuoi 59 Nhap nam
sinh cua ban : Kt qu hin th trn trnh duyt: Khi ln u tin m trang
TinhTuoi.asp Sau khi nhp 1977 vo textbox (hy trn thanh a ch) V d 2:
Gi lp mt ng dng hin th cc sn phm v cho php ngi dng xem chi tit mt
hng khi ngi dng click chn hyperlink tng ng. Trong ng dng gi lp ny,
ta s hin th 3 u mc sn phm c dng :HDD Seagate 40 GBXem chi tit HDD
Seagate 80 GBXem chi tit HDD Seagate 160 GBXem chi tit 60Khi ngi
dng click vo Hyperlink "Xem chi tit" bn cnh mi sn phm th ta hin th
thng tin tng ng v sn phm . Khi ngi dng chn mt mc th cn phi c thng
tin gi tr li trang x l bit h chn sn phm no hin th thng tin ph hp n
cha trong mi Hyperlink phi c nhng thng tin cn thit, v d mt m sn phm
(MaSanPham) chng hn Dng hnh thc gi GET l ph hp ! Trang
ShowProduct.asp - Hin th sn phm v chi tit sn phm: 2 in 1 Hien thi
san pham HDD Seagate 20 GB Xem chi tit HDD Seagate 40 GB Xem chi
tit HDD Seagate 80 GB Xem chi tit ???
Request.QueryString("MaSanPham")= "" c ngha g ? 61Phin bn trn : S
dng mt trang va hin th va x l d liu gi n (kiu 2 in 1). Ta c th s
dng c ch 1 in 1, tc l: Trang hin th ring v trang hin th chi tit
ring: Trang HienThiSP.htm Hin th sn phm HDD Seagate 20 GB Xem chi
tit HDD Seagate 40 GB Xem chi tit HDD Seagate 80 GB Xem chi tit
Trang ShowDetail.asp Hin th chi tit sn phm Nhn xt : Gi d liu theo
kiu POST khi no ? v GET khi no ? Mt s bi tp: (S dng c phng php gi
POST v GET) 1.Vit trang web tra cu t in. Cho ngi dng nhp vo mt t
ting Anh, trang web s hin th ngha ting vit tng ng. 2.Vit trang web
thc hin tnh ton vi cc php ton, hm n gin. 3 i tng server L mt i tng
cung cp mt s hm thng dng trong ng dng. C 2 phng thc c cung cp bi i
tng server l Mappath v CreateObject. 1.3.1. Phng thc Mappath Tr v
ng dn vt l t ng dn (th mc) o. + C php: Server.Mappath(ng dn o/ tng
i) + V d: C mt a ch nh sau: http://localhost/HienThiSP.htm V tr o
ca tp Hienthisp.htm trn webserver Trang web HienThiSP.htm c ng dn o
l Localhost/HienThiSP.htm. ng dn vt l (nm trn cng ca trang ny) l:
c:\inetpub\wwwroot\HienThisp.htm 63 V tr vt l ca tp Hienthisp.htm
trn cng. Trong trng hp ny, Server.Mappath(HienThiSP.htm) s cho ta
kt qu l c:\inetpub\wwwroot\HienThisp.htm. Nh vy hm Mappath thc hin
nh x t ng dn o ng dn vt l. Hm ny c bit hay dng khi chng ta tham
chiu n ng dn vt l ca cc tp CSDL khi kt ni. V d: Trang
Mappath_Demo.asp Mappath Duong dan vat ly cua mot so trang web
:
Kt qu: Kt qu Lu : Nu tp khng tn ti hoc ng dn o a vo sai th hm tr v
s l mt xu gm ng dn ti th mc wwwroot cng vi xu t trong mappath. Hi :
Khng cn dng n Mappath c c khng ? 1.3.2. Phng thc CreateObject To ra
mt s i tng. V d to ra cc i tng truy xut n CSDL. + C php: Set =
Server.CreateObject(Xu m t i tng cn to) Xu thng dng (i tng thng c
to): ADODB.Connection v ADODB.Recordset. + V d : To mt i tng
Connection v i tng Recordset Dim Conn, Rs Set Conn =
Server.CreateObject("ADODB.Connection") Set Rs =
Server.CreateObject("ADODB.Recordset") 4 i tng session bin sesstion
i tng Session : Dng qun l cc thng tin lin quan n mt phin lm vic. Mt
phin (Session) lm vic l g ?: Mi khi m trnh duyt (ln u tin) vo
website ng dng, ta to ra mt phin lm vic. Phin lm vic kt thc khi ta
ra khi website ng dng hoc khi tt c cc ca s trnh duyt b ng. 654.1.
Bin Sesstion Khi vo mt website, ngi dng c th duyt rt nhiu trang web
ca website . Nu mun lu tr thng tin v khch thm ny trong c phin lm
vic th c th lu vo cc bin, gi l bin Session. 4.2. i tng Session L i
tng dng qun l (to, c, ghi) cc bin sesstion v mt s thng s khc. + C
php to bin Session nh sau: Session(Tn_Bin) = Lu : Tn bin phi t
trong cp du nhy kp. c th l xu k t hoc s. V d : To mt bin tn l
MaNguoiDung v gn gi tr l TK34 Session(MaNguoiDung) = TK34 + C php c
gi tr ca mt bin sesstion nh sau: Session(Tn_Bin) + C php ghi (thay
i) gi tr ca bin session: Session(Tn_Bin) = V d: Response.write(M
ngi dng l : &Session(MaNguoiDung)) Ring vi i tng Session, n cn
c cc s kin. Cc s kin ny t ng c gi mi khi mt phin lm vic c to ra. Cc
s kin ny c tn l On_Start v On_End. Cc s kin ny c t trong file
Global.asa. File Global.asa '/// Th tc ny c gi khi bt u mt phin SUB
Session_OnStart '........ Session("MaNguoiDung") = "Khch_L"
'......... END SUB '/// Th tc ny c gi khi kt thc mt phin SUB
Session_OnEND '........ END SUB V d c gi tr bin Session: File
Session_Demo.asp c gi tr ca bin Session c tn l MaNguoiDung 66 V d:
Ch hin th cc trang ch (Home.asp) nu ngi dng c tn (UserName) l TK34
v mt khu l 123456. Nu khng th hin th trang Login.asp ngi dng ng
nhp. Trang Global.asa '/// Thu tuc nay duoc goi khi bat dau mot
phien SUB Session_OnStart '........ Session("MaNguoiDung") = ""
Session("MatKhau") = "" Session("TrangThaiDangNhap") = "ch-a"
'......... END SUB '/// Thu tuc nay duoc goi khi ket thuc phien lam
viec SUB Session_OnEND '........ END SUB Trang Login.asp Dang nhap
67Trang Home.asp Trang ch *Lu : C th to bin Session bt k u ch khng
nht thit trong file Global.asa ??? Dng bin Session khi no ? 5 i tng
application Dng qun l cc bin c phm vi ton ng dng. 5.1. Khi nim bin
ton ng dng Bin ton ng dng l bin c tc dng i vi mi ngi dng truy cp vo
website. 5.2. i tng Application Dng qun l (To, c, ghi) cc bin c phm
vi ton ng dng. + C php to bin Application: Application(Tn_Bin) = +
V d: To bin So_Nguoi_Truy_Cap Application(So_Nguoi_Truy_Cap) = 0 +
V d : c v ghi bin Application Application(So_Nguoi_Truy_Cap)=
Application(So_Nguoi_Truy_Cap) + 1 Response.write(Bn l v khch th:
& Application(So_Nguoi_Truy_Cap)) Lu : Khi bin tn ti th lnh trn
c hiu l gn gi tr mi, cn nu cha tn ti th c hiu l to bin. i tng
Application cng c 2 s kin l Application_OnStart v
Application_OnEND. S kin OnStart ch c kch hot duy nht mt ln khi yu
cu u tin pht sinh. S kin OnEND c kch hot khi dch v web dng
(unload). itngApplicationc2phngthclLockvUnlock.KhigiphngthcLock
(kha) th tt c cc ng dng khng c php thay i cc gi tr Application. cc
ng dng khc c php thay i cc bin Application th gi phng thc Unlock.
68M lnh vit cho 2 s kin ny cng c t trong file Global.asa. 5.3. V d
tng hp Mi khi ngi dng truy cp vo website th hin th cho ngi bit l v
khch th bao nhiu chng hn hin th trong trang Home.asp. Trang
Global.asa '/// Thu tuc nay duoc goi duy nhat mot lan SUB
Application_OnStart Application("SoKhachTruyCap") = 0 END SUB '///
Thu tuc nay duoc goi khi IIS stop SUB Application_OnEND
Application("SoKhachTruyCap") = 0 END SUB '/// Thu tuc nay duoc goi
khi bat dau mot phien SUB Session_OnStart '........
Application("SoKhachTruyCap") = Application("SoKhachTruyCap") + 1
'......... END SUB Trang Home.asp Trang chu 6 Chn file vo trang asp
Rt nhiu trang c nhng phn thng tin ging ht nhau (V d phn u trang,
chn trang hay phn kt ni n CSDL) nhanh chng, d dng sa i, bo tr, ASP
cho php ngi dng chn mt trang vo trang web hin ti. 692. C php chn
file: + Loi_ng_Dn c th l File hoc Virtual. Nu Loi_ng_Dn = File th
Tn_File l ng dn tng i tnh t th mc hin hnh. Nu Loi_ng_Dn = Virtual
th Tn_File s l ng dn o y . V d 1: V d 2 : 3. V d tng hp To mt trang
web cha footer cung cp thng tinlin h. Footer ny xut hin trong tt c
cc trang, trong c trang Home.asp. Cc bc tin hnh: To mt trang cha ni
dung footer, t tn l Footer.asp Sau Include vo cc trang v d trang
Home.asp Trang Footer.asp © by TK34 - UTEHY 2006.
Telephone: 0321-123456/ Fax: 0321-713015; E-Mail:
[email protected] Lu : - Thng th cc trang c Include nh th ny c
ui m rng l *.inc - Ni dung cc trang Include c th cha c th HTML v c
m lnh asp Trang Home.asp (C Include trang Footer.asp) Trang chu 70
Kt qu khi hin th trang home.asp IV. Kt ni v thao tc vi CSDL trong
asp 1. Qui tc chung - To i tng Connection v Recordset s dng phng
thc Server.CreateObject - Kt ni n CSDL - Thc thi cc cu lnh SQL thng
qua phng thc Execute ca /tng Connection - c d liu t Recordset s dng
vng lp- Kt hp vi i tng Response gi tr kt qu v cho trnh duyt. 2. To
i tng Connection v kt ni n CSDL Qui c: Tp c s d liu dng trong sut
cc v d l tp nwind.mdb v c t ti th mc gc ca ng dng. Trang KetNoi.asp
Ket noi Version 2: Kt ni v c d liu s dng phng thc Open ca i tng
Recordset. c d liu thng qua phng thc Open Danh sach nha cung cap
Dng cch ny, v sau ta c th thm v cp nht CSDL thng qua Rs. 4.2.1 Hin
th danh sch cc sn phm trong mt bng Thng tin hin th gm: Tn sn phm,
gi, 4.2.2 Thm bn ghi vo trong CSDL Xy dng trang asp cho php ngi dng
thm cc nh cung cp vo 4.3 Hin th danh sch cc nh cung cp trong mt
ComboBox 4.4 Hin th Tn cc nh cung cp(Companyname), v bn cnh tn nh
cung cp c thm ctXemccsnphmdonhcungcpsnxutra.Khingidngclickvo
Hyperlink ny th hin th tn cc sn phm do nh cung cp sn xut ra. 4.5 To
mt form nhp cho php ngi dng nhp thm nh cung cp. 4.6 To mt form tm
kim thng tin chi tit nh cung cp. Thng tin nhp vo l m nh cung cp
(SupplierID) 4.7 To mt trang cp nht thng tin v nh cung cp (bng
Suppliers) 4.8 To mt trang cho php xa bn ghi trong bng Suppliers
4.9 To mt trang hin ththm 3 ct Add, Update, Delete cho ngi dng c th
thm, sa i v xa bn ghi trong bng Suppliers. 4.10 To mt bng Users,
cha ti khon ngi dng. Sau xy dng trang Login.asp thc hin vic ng nhp.
4.10 To mt trang hin th danh mc cc loi sn phm, mi khi ngi dng click
vo mt chng loi th hin th cc sn phm thuc chng loi . 4.11 Hin th danh
sch sn phm theo tng trang 10 bn ghi / 1 trang. THE END.