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:aptech@utehy.edu.vn;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:aptech@utehy.edu.vn;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 quynm@utehy.edu.vn -Th.s Phm Ngc Hng pnhung@utehy.edu.vn-K.s L Quang Li loilq@utehy.edu.vn + 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 &copy by TK34 - UTEHY 2006. Telephone: 0321-123456/ Fax: 0321-713015; E-Mail: TK34@googlegroups.com 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.