›
›

Bài giảng Thiết kế web căn bản TN202 - Nguyễn Thị Thùy Linh

pdf 130 trang hapham 1370
Download
Bạn đang xem 20 trang mẫu của tài liệu "Bài giảng Thiết kế web căn bản TN202 - Nguyễn Thị Thùy Linh", để tải tài liệu gốc về máy bạn click vào nút DOWNLOAD ở trên

Tài liệu đính kèm:

  • pdfbai_giang_thiet_ke_web_can_ban_tn202_nguyen_thi_thuy_linh.pdf

Nội dung text: Bài giảng Thiết kế web căn bản TN202 - Nguyễn Thị Thùy Linh

  1. BÀI GI NG THI T K N TN202 GV: Nguy n Th Thùy Linh Bộ môn Tin Học Ứng Dụng – Khoa Khoa Học Tự Nhiên
  2. Gi i thi u • JavaScript là lo i ngôn ng Script ưc tích hp vào trang Web qua th HTML , hu ht các Web Browser h tr . • JavaScript th ưng dùng x lý các s ki n xy ra t Web Browser ca trang Web : Ki m tra d li u nh p t form to pop up ,form, pop-windows • JavaScript là ngôn ng ưc t ch c theo ki u i tưng. Các i tưng trong JavaScript là: String, Date, Math, Array, Window 2
  3. Qui tc trong JavaScript • Mã JavaScript t trong th • JavaScript phân bi t ch hoa ch th ưng trong t tên và t khóa. •Kt thúc câu lnh trong JavaScript bng du ; • Chu i (String) trong JavaScript ưc xác nh bi cp “” ho c ‘’ • \ dùng xác nh các ký t c bi t trong chu i • Tên bi n, hng bt u bi ch cái, $, _ , ti p sau là các ký t s và không kho ng tr ng gi a các ký t. 3
  4. Ngôn ng trong JavaScript • Ki u d li u: – Ki u s: s nguyên và s th p phân – Ki u chu i ký t – Ki u logic • Khai báo bi n: var , ho c ch gán giá tr cho bi n • Cu trúc iu khi n: –Cu trúc r nhánh: if , if else , switch –Cu trúc lp: for, while • Hàm: ưc xác nh bi t khóa function function ( ){ return ;} 4
  5. CU TRÚC C A ON JAVASCRIPT 1. Nhúng Javascript vào tp tin HTML Các lnh Javascript  Có th vi t nhi u an mã Javascript trong cùng mt tp tin HTML.  Các kh i mã Javascript có th t bt k v trí nào trong trang HTML. 5
  6. CU TRÚC C A ON JAVASCRIPT Ví dụ 1: document.write(“What is your name? ”); Ni dung ca trang 6
  7. CU TRÚC C A ON JAVASCRIPT •Sử dụng tập tin JavaScript bên ngoài: Có th vi t tp tin Javascript, sau ó kt ni vi mt ho c nhi u tp tin trang web khác nhau Cú pháp: JavaScript program Lưu ý: trong th ẻ JavaScript, bỏ SRC và Language , 7 khi đó ngôn ng ữ mặc định là JavaScript
  8. CU TRÚC C A ON JAVASCRIPT Môi tr ưng vi t JAVASCRIPT: Dreamweaver vi t mã Javascript, h tr phân bi t t khóa bng màu ch , h tr các hàm, thu c tính ca các tag , s dng thu n tiên trong vi c thi t k. 8
  9. CÚ PHÁP C B N C A L NH 1.Lnh ơ n và kh i lnh:  Lnh n: là câu lnh ưc kt thúc bng du ch m ph y(;). ho c không dùng du gì c.  Kh i lnh : là tp hp nhi u câu lnh ơ n ưc bao bc bi cp du {} • Li chú thích trong ch ươ ng trình : JavaScript h tr 2 lo i chú thích: − Chú thích trên mt dòng: dùng cp du // − /* */ Chú thích trên nhi u dòng: dùng cp du 9
  10. CÚ PHÁP C B N C A L NH • Xu t d li u ra trang Web: JavaScript h tr ph ươ ng th c hi n th d li u ra trang Web là: + document.write() + document.writeln() − Nu d li u là chu i ph i ưc t trong cp “” . − Xu t giá tr là bi n − Có th dùng du + ni các chu i và bi n document.write(“String ” + variable ); − Nu xu t tag HTML thì cp tag t trong cp du “” 10
  11. CÚ PHÁP C B N C A L NH Ví dụ: document.write (“Tr ưng "); document.write(" Tr ưng "); a =“HCT” document.write (“Tr ưng “ + a); 11
  12. CÚ PHÁP C B N C A L NH • S dng document.writeln() và tag :  Dùng vi tag xu t d li u và xu ng dòng. document.writeln()  Nu không có cp tag document.writeln() to mt kho ng tr ng 12
  13. CÚ PHÁP C B N C A L NH Ví dụ: document.writeln(" Hello "); document.writeln(" World "); 13
  14. BI N VÀ D LI U TRONG JAVASCRIPT • Bi n − Bi n là tên s dng lưu tr ho c kt qu trung gian ca quá trình tính toán − Trong Javascript khi khai báo bi n không cn xác nh ki u d li u cho bi n, do ó khi mt bi n ưc khai báo thì nó có th là ki u d li u bt k 14
  15. BI N VÀ D LI U TRONG JAVASCRIPT • Cách khai báo bi n: Trong JavaScript, th b dùng t khóa var . var VariableName ; Ví d: var a ; Ho c a=5; // khai báo và kh i to − Mt bi n có th kh i to giá tr ban u − Khai báo nhi u bi n cùng mt lúc thì phân cách dùng (,) 15
  16. BI N VÀ D LI U TRONG JAVASCRIPT − Mt bi n có th ch a bt k ki u d li u nào, giá tr ca bi n có tác dng t v trí khai báo tr i Ví d: var a=”Hello World”; a=1999 ; • Cách xu t giá tr ca bi n: document.write(VariableName ) Ví d: var a=”Hello World”; a=1999 ; 16 document.write(a )
  17. BI N VÀ D LI U TRONG JAVASCRIPT • Quy tc t tên bi n: Tên bi n gm các ch cái và s, không dùng các ký t c bi t nh ư: ( , [ , { , # , & . theo nguyên tc sau: – Tên bi n ph i bt u bng ký t ho c ký t gch dưi( _ ) – Không bt u bng ký t s. – Không ch a kho ng tr ng, tên bi n ph i gi nh – Không trùng vi t khoá ca JavaScript • Các t khoá trong JavaScript 17
  18. BI N VÀ D LI U TRONG JAVASCRIPT •Tm vc ca bi n: là tm nh hưng ca bi n trong ch ươ ng trình. Có 2 lo i bi n:  Bi n toàn cc: ưc khai báo ngoài các hàm. Ph m vi ho t ng ca bi n là t v trí khai báo tr v sau trong ch ươ ng trình.  Bi n cc b: ưc khai báo trong ch ươ ng trình con. Ph m vi ho t ng ca bi n là t v trí khai báo n kt thúc ch ươ ng trình con. Lưu ý: Nu tên bi n toàn cc trùng cc b thì biên ưc s dng trong hàm là bi n cc b. 18
  19. BI N VÀ D LI U TRONG JAVASCRIPT • D li u: Có 4 lo i d li u – Ki u s: mt bi n ki u s ch a bt k giá tr s nào: s th p phân, s nguyên, s dng ch m ph y ng. – Ki u chu i: mt bi n ki u chu i có th ch a mt nhóm ký t (Ch cái, ký t s, kho ng tr ng, các ký t c bi t, ). Giá tr chu i ph i t trong cp du nháy ôi ( “”) ho c ơ n ( ‘’) Ví d: var s1, s2, s3 ; s1=”Hello World” ; s2=’Hello World ‘ ; 19
  20. BI N VÀ D LI U TRONG JAVASCRIPT • Toán t chu i Ký hi u: + Là phép toán ni hai chu i Ví d: txt1=”Welcome to”; txt2=“JavaScript!"; document.write(' '+txt1+txt2+' '); 20
  21. BI N VÀ D LI U TRONG JAVASCRIPT • Toán t iu ki n: Cú pháp: (iu ki n) ? value1: value2 − Nu bi u th c iu ki n úng thì tr v giá tr value 1 − Nu bi u th c iu ki n sai thì tr v giá tr value 2 Ví d: document.write(( day="Saturday ") ? "Weekend": "Not Saturday") 21
  22. BI N VÀ D LI U TRONG JAVASCRIPT • Mt s ký t c bi t: − \n : new line − \t : tab − \b : BackSpace − \& : du & − \”: du “ Ví d: document.write (" You \& i sing \"Happy Birthday\".") 22
  23. HÀM TRONG JAVASCRIPT 23
  24. HÀM TRONG JAVASCRIPT NH NGH A Hàm là mt an ch ươ ng trình có th ưc s dng nhi u ln trong mt ch ươ ng trình th c hi n mt tác v nào ó. • Cách xây dng hàm: Dùng t khoá function nh ngh a hàm. Cú pháp: function FunctionName ( List_Parameter ) { Khai báo các bi n s dng trong hàm ; Các câu lnh trong JavaScript th c hi n tác v; [return [giá tr /bi u th c] ]; } 24
  25. HÀM TRONG JAVASCRIPT − FunctionName: là tên hàm do ng ưi lp trình t. Qui tc t tên hàm gi ng nh ư tên bi n. − Sau FunctionName là cp du ngo c ( ) ch a danh sách tham s hình th c. List_Paramete r: là danh sách các tham s hình th c, nu có nhi u tham s có thì các tham s ph i cách nhau bi du ph y, các tham s này không ch ra ki u d li u c th và cng không cn t khoá var. 25
  26. HÀM TRONG JAVASCRIPT − Câu lnh return: kt thúc hàm. nu hàm có giá tr tr v thì return tr v giá tr − Sau Return có th ch a ho c không ch a mt giá tr c th ho c mt bi u th c tính toán. Ví d: function Display(user , pwd) { document.write(“UserName cua ban la:” + user) ; document.write(“Password cua ban la:” + pwd) ; return ; } 26
  27. HÀM TRONG JAVASCRIPT • Cách gi hàm: Hàm không th c hi n cho n khi nó ưc gi. − i vi hàm có i s, gi tên hàm và danh sách các giá tr truy n cho i s ó. FunctionName(argument1,argument2,etc) − i vi hàm không có i s, ch cn gi tên hàm FunctionName() − i vi hàm không có giá tr tr v: NameFunction(parameter) . − Hàm có giá tr tr v: ph i gán giá tr tr v cho bi n variable= NameFunction(parameter) . 27
  28. HÀM TRONG JAVASCRIPT Ví d: Function function tong(a , b) { c=a+b; document.write(c); } tong(2,3); 28
  29. CÁC HÀM THÔNG D NG TRONG JAVASCRIPT • Hàm alert(): Dùng hi n th mt hp thông báo có nút OK Cú pháp: alert(“ni dung thông báo”) Ví d: Function alert("Hello World") 29
  30. CÁC HÀM THÔNG D NG JAVASCRIPT • Hàm prompt(): To hp tho i ch a 2 nút OK ,Cancel và mt textbox ng ưi dùng nh p ni dung, giá tr tr v ca hàm prompt là ni dung nh p trong textbox Cú pháp: prompt(“ni dung i tho i”,giá tr kh i to); ví d: a=prompt("Your Lastname:"); b=prompt("Your FirstName:"); document.write("Your FullName is :"+ a + ' ' + b) 30
  31. CÁC HÀM THÔNG D NG JAVASCRIPT • Hàm confirm(): Hi n th hp thông báo có 2 nút OK và Cancel. Hàm tr v giá tr true nu ng ưi s dng click OK và ng ưc li thì tr v giá tr false . Cú pháp: variable=confirm(“Chuoi thong bao”); Ví d: a=prompt("nhap so a :"); b=prompt("nhap so b"); c=confirm( a +' lon hon '+ b+'?') if(c==true) document.write( a +" > "+b ) else document.write( a +" 31
  32. CÁC HÀM THÔNG D NG JAVASCRIPT • Các hàm thông dng ca chu i và s: – Hàm eval(): Tr v giá tr s ca mt chu i s Cú pháp: eval(chu i s) Ví d: var str1=”123”, str2=”456”; str= (str1); document.write(str);  kt qu :123456 32
  33. CÁC HÀM THÔNG D NG JAVASCRIPT Ví d: a = eval(prompt(“Nh p s a:”)); b = eval(prompt(“Nh p s b:”)); c = a+b ; document.write(c) 33
  34. CÁC HÀM THÔNG D NG JAVASCRIPT • Hàm ParseInt(strNum) − Tr v mt s nguyên t chu i strNum . − Nu strNum theo sau là ký t ch thì các ký t này s b b qua. − Nu strNum không bt u bng s thì hàm này tr v giá tr NaN (Not a Number) Ví d : var strNum=”123.8” , kq; kq=parseInt(strNum) =>kq=123 strNum=”a123” kq=parseInt(strNum) =>kq=NaN strNum=”123.8abc” 34 kq=parseInt(strNum)=>kq=123
  35. CÁC HÀM THÔNG D NG JAVASCRIPT • Hàm parseFloat(strNum): − Hàm tr v mt s th c t chu i strNum . − Nu chu chu i i strNum bt u là s và theo sau là các ký t ch thì các ký t này b b qua. − Nu chu i strNum bt u t ký t ch thì hàm tr v giá tr NaN. Ví d: var strNum=”123.8” , kq; kq=parseFloat(strNum) =>kq=123.8 strNum=”a123.8” kq=parseFloat(strNum) =>kq=NaN strNum=”123.8abc” kq=parseFloat(strNum)=>kq=123.8 35
  36. CÁC HÀM THÔNG D NG JAVASCRIPT • Hàm isNaN(str): Hàm tr v giá tr True nu str là chu i, ng ưc li là False nu str là chu i s. Ví d: Var str=”123abc”, kq; kq=isNaN(str) =>kq=true; str=”123.8” kq=isNaN(str) =>kq=false ; 36
  37. CÁC HÀM THÔNG D NG JAVASCRIPT Các hàm thi t lp th i gian : • Hàm setTimeout( ) : Báo cho JavaScript th c hi n mt lnh JavaScript sau mt kho ng th i gian nào ó. − Hàm tr v mt ID (duy nh t i vi mi hàm setTimeout th c hi n mt lnh) − Giá tr ID này dùng xoá kho ng th i gian ã thi t lp nu không cn th c hi n hàm Timeout na Cú pháp: IdTime=setTimeout(“Command JavaScript”, delayTime); − Command JavaScript : có th là li gi hàm ho c là mt câu lnh ơ n − delayTime :là kho ng th i gian ch thi hành Command JavaScript, ưc tính bng mili giây. 37
  38. CÁC HÀM THÔNG D NG JAVASCRIPT Ví d: Idq=setTimeout(“alert(‘ã ht gi ’)”,1000) ; C 1000 mili giây thì thông báo ã ht gi mt ln. • Hàm clearTimeout() : Hu th i gian ã thi t lp bi setTimeout(). Cú pháp: clearTimeout(IdTime ); Ví d: clearTimeout(Idq ); • Hàm setInterval() và clearInterval(): Ý ngh a và tham s gi ng nh ư setTimeout() và clearTimeout() 38
  39. CU TRÚC IU KHI N 39
  40. CU TRÚC L A CH N • Câu lnh if: Mu 1: 1 iu ki n và 1 công vi c x lý Cú pháp: if ( ) Kh i lnh 1; Kh i lnh 2; 40
  41. CU TRÚC L A CH N Mu 2: 1 iu ki n và 2 la ch n công vi c x lý Cú pháp: if( ) Kh i lnh1; else Kh i lnh 2 ; Kh i lnh 3; 41
  42. CU TRÚC L A CH N • Mu 3 (if else lng nhau): Áp dng cho tr ưng hp có nhi u ch n la khác nhau Cú pháp: if( ) Kh i lnh 1; else if ( ) Kh i lnh 2 ; else kh i lnh 3 42
  43. CU TRÚC L A CH N a=eval(prompt("Nhap canh a")); b=eval(prompt("Nhap canh b")); c=eval(prompt("Nhap canh c")); if(a+b
  44. Cu trúc ch n la Switch Case • Mu 1: switch( Bi u th c) { case value 1: Kh i lnh 1; break; case value 2: Kh i lnh 2 ; break; case value k: Kh i lnh k ; break; 44 }
  45. Cu trúc ch n la Switch Case • Mu 2: switch (bi u th c) { case value 1: kh i lnh 1 ; break; case value 2: kh i lnh 2 ; break; case value k: kh i lnh k ; break; default : 45 kh i lnh k+1 ; }
  46. Cu trúc ch n la Switch Case VVíí dd:: t=prompt( "nh p tháng: "); switch (eval(t)) { case 1: case 3: case 5: case 7: case 8 : case 10: case 12: alert("Tháng "+ t+ " co 31 ngày"); break; case 2: alert("Tháng "+t + " co 28 ngày"); break; case 4: case 6: case 9: case 11: alert("Tháng "+t +" co 30 ngày"); break; default: alert("Không có tháng này"); } 46
  47. CU TRÚC L P • Vòng lp For : Áp dng cho s ln lp bi t tr ưc Cú pháp: for(bi u th c 1; bi u th c 2; bi u th c 3) { Kh i lnh 1; } kh i lnh 2; 47
  48. CU TRÚC L P Ví d: Vi t ch ươ ng trình to mt table m dòng n ct. var n, m, i, j; m=prompt("Nhap so dong"); n=prompt("Nhap so cot"); document.write(" "); for(i=1;i "); for(j=1;j " + i + j +" "); document.write(" "); } 48 document.write(" ");
  49. CU TRÚC L P • Vòng lp while : áp dng cho s ln lp không xác nh – Vòng lp While: Ki m tra iu ki n tr ưc khi th c hi n lnh Cú pháp: while(bi u th c iu ki n) { Kh i lnh 1; } Kh i lnh 2; 49
  50. CU TRÚC L P Ví d: var input; while (input!=99 ) { input =prompt(“Nh p vào mt s by k, nh p 99 thoát”) if(isNaN(input) { document.write(“D li u không hp l, nh p s ”); break; 50 }
  51. CU TRÚC L P • Vòng lp do while : Th c hi n lnh tr ưc sau ó ki m tra bi u th c iu ki n Cú pháp: do { kh i lnh 1; } While(bi u th c iu ki n); kh i lnh 2; 51
  52. CU TRÚC L P Ví d: var input; do { input=prompt(“Nh p vào mt s by k, nh p 99 thoát”); if(isNaN(input)) { document.write(“D li u không hp l, nh p s ”); break; } }while (input!=99 ) 52
  53. CU TRÚC L P • Vòng lp for in : dùng duy t qua các thu c tính ca mt i tưng hay giá tr ca các ph n t trong mng Cú pháp: for ( variable in Object) { kh i lnh 1 ; } kh i lnh 2; 53
  54. CU TRÚC L P Ví d: obj= new Array() ; obj[0]="Hello"; obj[1]="World" ; for(i in obj) document.write(obj[i]); 54
  55. CU TRÚC L P • Câu lnh try catch và throw : dùng x lý li trong các modul. Nó ưc dùng trong Internet Explorer 5 và trong IIS Cú pháp: try { kh i lnh ; } catch(objErr) { X lý li ; } 55
  56. MÔ HÌNH I T ƯNG 56
  57. MÔ HÌNH DOM (Document Object Model) • i tưng – Mô hình i tưng : − Mi thành ph n trên trang web ưc xem nh ư mt i tưng , Tt c các i tưng trong Javascript ưc t ch c phân cp dng hình cây gi là mô hình DOM (Document Object Model), mc trên cùng là i tưng window bi u th cho khung hay ca s ca trình duy t, các ph n t còn li là i tưng con ca window. − truy xu t n mt i tưng trong IE và thay i d li u cho chính ph n t ó dùng thu c tính ID , tt c các i tưng trên trang u có mt ID duy nh t. 57
  58. MÔ HÌNH DOM (Document Object Model) windowwindow documentdocument eventevent frameframe historyhistory locationlocation navigatornavigator screen documentdocument anchoranchor image image ResetReset submit submit appletapplet layer layer buttonbutton formform classclass link link checkcheck boxbox elementelement selectselect plug-inplug-in hiddenhidden embedembed passwordpassword stylestyle texttext IDID radioradio tagtag 58 textareatextarea
  59. MÔ HÌNH DOM (Document Object Model) • Mc ích ca mô hình DOM: − nh ngh a 1 t ch c phân cp th hi n các ph n ca 1 web. − Cho phép thay i cu trúc ó thông qua vi c thêm bt ni dung − Cung cp cách th c quan sát, thao tác các c tính ni dung trên trang web − Cung cp thông tin v cách tươ ng tác gi a các mc trên trang web vi ng ưi dùng − Cho phép thông báo các s ki n gây ra do chu t và bàn phím 59
  60. MÔ HÌNH DOM (Document Object Model) − Mu n truy cp 1 i tưng thì ph i truy cp vào i tưng ch a nó tr ưc, dùng du ch m (.) phân cách gi a các i tưng. − Có th b qua i tưng window nu ang thao tác trên ca s hi n hành Ví d: window.location − Ngoài các i tưng do ch ươ ng trình ã xây dng, có th to thêm nh ng i tưng mi cn thi t cho nhu cu s dng. − Mi i tưng u có các thu c tính , ph ư ng th c và s ki n. 60
  61. MÔ HÌNH DOM (Document Object Model) – Thu c tính (Properties) : là nơi ch a các mô t thông tin ca i tơng. Ví d: Trong tag Img: có 3 thu c tính src, width, height, thay i kích th ưc hình, da vào thu c tính Id là: Idh1 . s Idh1. width , Idh1. height Idh1. src 61
  62. MÔ HÌNH DOM ((Document Object Model) Ví d function ZoomIn() { Idh1.width=Idh1.width +10; Idh1.height=Idh1.height + 5; } function ChangeImg(file) { Idh1.src=file ; } 62
  63. MÔ HÌNH DOM (Document Object Model) • S ki n (event): là các hành ng, s vi c xãy ra trên trang web: click chu t, di chuy n chu t, S ki n ưc x lý bi các on mã gi là b x lý s ki n • Cách s dng các s ki n: mu n iu khi n s ki n, ta thêm s ki n ó vào trong th HTML. • Cú pháp: – TagName : tên tag – eventhandler : tên s ki n – JavaScript Command : gi hàm x lý s ki n 63
  64. MÔ HÌNH DOM ((Document Object Model) Tên s ki n Ý ngh a Onmousedown Phát sinh khi ng ưi dùng click chu t Onmouseover Phát sinh khi ng ưi dùng d/chuy n chu t lên i tưng Onmouseout Phát sinh khi ng ưi dùng d/chuy n chu t ra ngoài i tưng Onkeypress Phát sinh khi ng ưi dùng nh n mt phím Onfocus Phát sinh khi i tưng nh n tiêu im Onblur Phát sinh khi ri kh i i tưng - Ng ưi dùng click chu t vào i tưng Onclick -Mt i tưng ang có tiêu im, ng ưi dùng nh n enter - Mt checkbox ho c nút ch n ang có tiêu im, ng ưi dùng nh n phím Spacebar Onload - Phát sinh khi i tưng ưc ti xu ng OnUnload - Phát sinh khi i tưng ưc np tr li ho c chuy n trang Onresize - Phát sinh khi ca s b thay i kích th ưc Onselect - Phát sinh khi i tơng ưc ch n 64 Onchange - Phát sinh khi i tưng thay i giá tr Onsubmit - Ph át sinh khi Form ư c Submit
  65. MÔ HÌNH DOM (Document Object Model) • Ph ư ng th c Method() : Là các hàm ươ c xây dng tr ưc có tác dng làm thay i thu c tính ca i tưng. Cách truy xu t vào ph ươ ng th c ca i tưng Object_name .Method() 65
  66. MÔ HÌNH DOM ((Document Object Model) • Xây dng mt i tưng mi: Cách xây dng mt i tưng mi: Gm 2 bưc Bưc 1: nh ngh a i tưng bng cách xây dng hàm cho i tưng ó gm các ph ươ ng th c và thu c tính cho i tưng ó. function Object(List Parameter) { this.property1= Parameter1; this.property2= Parameter2; this.method1=functionName1; 66 this.method2=functionName2 ; }
  67. MÔ HÌNH DOM ((Document Object Model) T khoá this tham chi u n i tưng ang ưc to. − Câu lnh this.property1= Parameter1 : gán giá tr Parameter1 cho thu c tính property1 − Tươ ng t: xâyd ng ph ươ ng th c cho i tưng thì gán ph ươ ng th c cho hàm ã nh ngh a sn: this.method1=FunctionName1; b)Bưc 2: To instance cho i tưng, var obj=new Object(); • Truy cp ho c thay i giá/ tr ca thu c tính: obj.property •S dng ph ươ ng th c : 67 obj.method ()
  68. CÁC I T ƯNG CÓ SN JAVASRIPT • i tưng Array(): Trong Javascript i tưng mng có th ch a các thành ph n mang ki u giá tr khác nhau. Mt mng có n ph n t: 0 n n-1. − i giá tr ca tng ph n t trong mng Kh i to mt mng: Dùng t khóa new kh i to mt mng var Variable = new Array(size) 68
  69. CÁC I T ƯNG CÓ SN JAVASRIPT Ví d: var arr= new Array() arr[0]= “Th hai"; arr[1]= " Th ba"; arr[2]= " Th tu"; arr[3]= " Th nam"; arr[4]= " Th sau"; arr[5]= " Th bay"; for(i=0; i ") 69
  70. CÁC I T ƯNG CÓ SN JAVASRIPT – Thu c tính và ph ươ ng th c ca Array() • length : xác nh s ph n t trong mng Ví d: var arr= new Array() arr[0]= “Thu hai"; arr[1]= "Thu ba"; arr[2]= "Thu tu"; arr[3]= "Thu nam"; arr[4]= "Thu sau"; arr[5]= "Thu bay"; document.write("S ph n t trong mng là: " +arr.length) 70
  71. CÁC I T ƯNG CÓ SN JAVASRIPT Ph ươ ng th c Ý ngh a Ví d concat() Dùng ni 2 mng a=a.concat(b) ghép các ph n t trong mng li vi join(separator) a=a.join(“+”) nhau cách nhau bi du separator Dùng tách mt mng bt u t vtrí slice(start,end) str=a.slice(i,j) start n vtrí end-1. reverse() Dùng o ng ưc mng a.reverse() Dùng ly tt c các i tưng trong valueOf() a.valueOf() mng pop() Ly ph n t cu i ca mng Thêm 1 ho c nhi u ph n t vào cu i push() mng ly ph n t và tr v ph n t u tiên Shift() ca mng Sort() sp xp các ph n t ca mng 71
  72. CÁC I T ƯNG CÓ SN JAVASRIPT Ví d 1: var a=new Array() a[0]= “Tháng giêng”; a[1]= “Tháng hai”; a[2]= “Tháng ba”; var b =new Array(); b[0]= “Th áng tư”; b[1]= “Th áng nm”; b[2]= “Th áng sáu”; a=a.concat(b); document.write(a); 72
  73. CÁC I T ƯNG CÓ SN JAVASRIPT Ví dụ 2 var arrName = new Array(3) arrName [0] = "Jani" arrName [1] = "Tove" arrName [2] = "Hege" document.write(arrName.length + " ") document.write(arrName.join(".") + " ") document.write(arrName.reverse() + " ") document.write(arrName.sort() + " ") document.write(arrName.push("Ola","Jon") + " ") document.write(arrName.pop() + " ") document.write(arrName.shift() + " ") 73
  74. CÁC I T ƯNG CÓ SN JAVASRIPT • i tưng Date() : Cung cp thông tin v ngày, gi trên môi tr ưng client. Dùng thi t lp ngày tháng nm và gi hi n hành trên trang web. – Cách khai báo: Có 2 cách khai báo Cách 1: Khai báo và kh i to var variableName= new Date(“month, day, year, hours : minutes : seconds”) Hay: var variableName= new Date(year,month,day,hours,minutes,second) 74
  75. CÁC I T ƯNG CÓ SN JAVASRIPT Ho ặc var variableName = new Date(year,month, day) var variableName = new Date("Month, dd, yyyy hh:mm:ss") var variableName = new Date("Month, dd, yyyy") var variableName = new Date(yy,mm,dd,hh,mm,ss) var variableName = new Date(yy,mm,dd) var variableName = new Date(milliseconds) variableName là bi n dùng lưu tr thông tin ngày tháng nm, gi phút giây. 75
  76. CÁC I T ƯNG CÓ SN JAVASRIPT − Tr ưng hp 1: giá tr kh i to là 1 chu i. Trong tr ưng hp này month là chu i, − Tr ưng hp 2 và 3, giá tr là mt s. Ví d: var objday =new Date("November,1,2010,7:30:9") // Khai báo hp l var objday= new Date("10,1,2010,7:30:9") //Khai báo không hp l • Cách 2: Khai báo ngày hi n hành var variableName=new Date() 76
  77. CÁC I T ƯNG CÓ SN JAVASRIPT – Các ph ươ ng th c ca i tưng Date() Để truy xu ất ph ươ ng th ức của đối tượng dùng cú pháp variableName.Method() Ph ươ ng th c Mô t Date() Tr v i tưng date getDate() Tr v giá tr ngày ( s nguyên t 1-31) trong tháng getDay() Tr v giá tr ngày trong tu n ( s nguyên t 0-6 Sunday=0) getMonth() Tr v tháng trong nm (from 0-11. 0=January, 1=February) getFullYear() Tr v giá tr nm (bn s ) getYear() Tr v giá tr nm (hai s ) getHours() Tr v gi ca h th ng (t 0-23) 77
  78. CÁC I T ƯNG CÓ SN JAVASRIPT getMinutes() Tr v phút ca h th ng (t 0-59) getSeconds() Tr v giây ca h th ng (t 0-59) getMilliseconds() Tr v giá tr millisecond from 0-999) setFullYear() Thi t lp li nm cho ngày h th ng ( 4 s) setHours() Thi t lp li gi cho h th ng ( t 0-24) setMinutes() Thi t lp li phút cho h th ng ( t 0-59) setMonth() Thi t lp li tháng cho h th ng ( t 0-11) setSeconds() Thi t lp li giây cho h th ng (from 0-59) 78
  79. CÁC I T ƯNG CÓ SN JAVASRIPT Ví d: d.setFullYear(2008) document.write(d.getFullYear()+" ") HAY function Ngay() { var day=new Date(); var w,m,d,y; var arrday=new Array(); 79
  80. CÁC I T ƯNG CÓ SN JAVASRIPT arrday[0]= “chu nhat”; arrday[1]= “Thu hai ”; arrday[2]= “Thu ba ”; arrday[3]= “Thu tu”; arrday[4]= “Thu nam ”; arrday[5]= “Thu sau”; arrday[6]= “Thu Bay”; w=day.getDay(); d=day.getDate(); m=day.getMonth()+1; y=day.getFullYear(); document.write(“Hom nay:”+arrday[w]+” ngay “+d+” thang “+m+ “ nam “ +y); } 80 Ngay () // gi hàm
  81. CÁC I T ƯNG CÓ SN JAVASRIPT • i tưng String() Mi chu i trong JavaScript là mt i tưng, gm các thu c tính và ph ươ ng th c th c hi n trên chu i: các ph ươ ng th c tìm ki m chu i, trích chu i con và áp dng các th HTML vào ni dung ca chu i. – Cách khai báo i tưng String var stringVariable=new String() Ví d: var st=new Student() 81
  82. CÁC I T ƯNG CÓ SN JAVASRIPT – Thu c tính ca Srting(): • Length : dùng xác nh chi u dài ca chu i. Các ký t trong chu i ưc ánh ch s t 0 n Length-1. – Cách tham chi u n thu c tính length ca i tơng String(): • StringLength=stringVariable.length • StringLength=”This is a string”.length – Các ph ươ ng th c ca String : Các ph ươ ng th c ca String th c hi n các thao tác trên ni dung ca chu i 82
  83. CÁC I T ƯNG CÓ SN JAVASRIPT Ph ươ ng th c Mô t Ví d Tham s name là thu c tính str.anchor(“name”) anchor("name") NAME ca tag . Tr v mt chu i t trong cp th big() str.big() Bold() Tr v mt chu i in m str.bold() Tr v ký t th index trong chu i. charAt(index) str.charAt(0) index t 0 n str.length-1 concat() Ni chu i Tr v mt chu i vi màu ã ưc fontcolor() str.fontcolor(“red”) xác lp. fontsize() kích th ưc font str.fontsize(“5”) 83
  84. CÁC I T ƯNG CÓ SN JAVASRIPT Tr v v trí ca u tiên ưc tìm th y ca chu i “str” bt u tìm t v trí fromindex . Nu không indexOf(“str”,[fromindex]) có fromindex thì tìm t v trí 0. Nu không tìm th y thì hàm tr v giá tr -1 italics() Tr v mt chu i in nghiêng Tr v v trí cu i cùng ưc tìm th y chu i “str”, lastIndexOf(“str”) tìm t trái qua ph i . Nu không tìm th y thì hàm tr v giá tr -1 link() Tr v mt chu i liên kt Tươ ng t nh ư hàm indexOf và lastindexOf, match() nh ưng ph ươ ng th c này tr v mt chu i c th nu không tìm th y thì tr v giá tr "null". replace() Thay th mt chu i bng mt chu i mi 84
  85. CÁC I T ƯNG CÓ SN JAVASRIPT Tr v giá tr là v trí chu i con ưc tìm th y trong chu i cha, search(‘str’) nu không tìm th y thì tr v giá tr -1 Tr v mt chu i con ưc ct slice(index) t chu i m ti v trí index Tr v mt chu i có kích th ưc small() nh hơn Tr v mt chu i ưc gnh strike() ngang qua thân chu i sub() Tr v mt chu i ki u subscript Str.sub() 85
  86. CÁC I T ƯNG CÓ SN JAVASRIPT Tr v chu i con bt u t v trí Str.substr(0,2)=”Th substr(start,length) start và có chi u dài length. nu không có start xem nh ư start=0 ” Tách ra mt chu i con t mt chu i. Bt u t ch s start n end. Nu Start<end , chu i tr v t substring(Start,end) start n end-1 Nu end<start , chu i tr v t end n start Nu start=end chu i tr v là null. sup() Tr v chu i ki u superscript toLowerCase() Chuy n chu i thành ch th ưng 86 toUpperCase() Chuy n chu i thành ch hoa
  87. CÁC I T ƯNG CÓ SN JAVASRIPT Ví d: var str=“Tr ưng i Cn Th ơ” document.write(" " + str + " ") document.write(“Chi u dài ca chu i là: “+ str.length) 87
  88. CÁC I T ƯNG CÓ SN JAVASRIPT Ví d Ph ươ ng th c indexOf. Ph ươ ng th c này tr v v trí ca chu i con ưc tìm th y trong mt chu i var str="This is my Schools " var pos=str.indexOf("School") if (pos>=0) { document.write("School found at position: ") document.write(pos + " ") } Else { document.write("School not found!") } 88
  89. CÁC I T ƯNG CÓ SN JAVASRIPT Ví d: var st=new String() st="KHOA KHOA H C T NHIÊN” document.write(st.lastIndexOf("N")+" ") document.write(st.link()+" ") document.write(st.match(“T NHIÊN”)+" ") document.write(st.replace("KHOA KHOA H C T NHIÊN", “TN")+" ") 89
  90. CÁC I T ƯNG CÓ SN JAVASRIPT • i tưng Math() i tưng Math() cung cp các hàm và các ph ươ ng th c cn thi t th c hi n các phép toán s hc. Không cn ph i to i tưng Math() mà chúng ta có th s dng tr c ti p i tưng này – Các ph ươ ng th c ca Math(): Cú pháp chung: Math.method([value]) 90
  91. CÁC I T ƯNG CÓ SN JAVASRIPT Ph ươ ng th c Mô t abs(x) Tr v giá tr tuy t i ca bi n x acos(x) Tr v giá tr arccosine ca x ceil(x) Tr v s nguyên ln hơn ho c bng x floor(x) Tr v s nguyên nh hơn ho c bng x log(x) Tr v giá tr log ca x max(x,y) Tr v giá tr ln nh t trong hai s x và y min(x,y) Tr v giá tr nh nh t trong hai s x và y pow(x,y) Tr v giá tr x ly th a y random() Tr v giá tr mt s ng u nhiên t 0 n 1 round(x) Làm tròn s x sqrt(x) Tr v giá tr cn bc 2 ca x 91
  92. CÁC I T ƯNG CÓ SN JAVASRIPT Ví d: var n= -136.8 , m=136.8 document.write("abs(-136.8) = " + Math.abs(n) +" ") document.write("ceil(136.8) = " + Math.ceil(m) +" ") document.write("floor (136.8) = " + Math.floor(m) +" ") document.write("pow (2,3) = "+ Math.pow(2,3)+" ") document.write("M t s ng u nhiên ") 92
  93. CÁC I T ƯNG CÓ SN JAVASRIPT Ví d: Vi t ch ươ ng trình to mt nút i hình (play) và nút stop ng ưng var idq; function play() { var arrhinh= new Array(); arrhinh[0]= " /images/h1.jpg"; arrhinh[1]= " /images/h2.jpg"; arrhinh[2]= " /images/h3.jpg"; arrhinh[3]= " /images/h4.jpg"; arrhinh[4]= " /images/h5.jpg"; arrhinh[5]= " /images/h6.jpg"; var i=Math.round(Math.random()*4) idhinh.src=arrhinh[i]; idq=setTimeout(“play()”,1000); 93 }
  94. CÁC I T ƯNG CÓ SN JAVASRIPT function stop() { clearTimeout(idq); } 94
  95. CÁC I T ƯNG CÓ SN JAVASRIPT • i tưng document :  Cung cp các thu c tính và ph ươ ng th c làm vi c vi toàn b tài li u hi n hành gm: form, liên kt, hình nh, tiêu , v trí hi n hành, màu hi n hành  nh ngh a khi tag body ưc x lý trong trang HTML và nó vn tn ti nu trang ưc np.  Các thu c tính ca document ph n ánh thu c tính ca tag body . Trong body có 2 s ki n OnLoad và Unload – Các thu c tính ca i tưng document 95
  96. CÁC I T ƯNG CÓ SN JAVASRIPT Thu c tính Mô t alinkcolor Thi t lp ho c tr v giá tr màu ca liên kt ang xem ca tài li u bgcolor Thi t lp ho c tr v giá tr màu nn ca tài li u cookie Ch a giá tr các cookies dành cho tài li u hi n hành domain Tr v giá tr tên mi n máy ch ch a document fgcolor Thi t lp ho c tr v giá tr màu ch ca tài li u lastmodified Tr v giá tr ngày gi cu i cùng mà tài li u ưc cp nh t 96
  97. CÁC I T ƯNG CÓ SN JAVASRIPT linkcolor Thi t lp ho c tr v giá tr màu ca liên kt trong tài li u location m mt trang web m i referrer Returns the URL of the document that loaded the current document title Tr v giá tr ca ta ca tài li u url Tr v ưng dn c tài li u hi n hành vlinkcolor Thi t lp ho c tr v giá tr màu ca liên kt ã xem ca tài li u 97
  98. CÁC I T ƯNG CÓ SN JAVASRIPT Ph ươ ng th c ca i tưng document Ph ươ ng th c Mô t clear() Xóa tài li u close() óng mt tài li u focus() ư a tr v mt i tưng trong trang open([“mimetype”]) M mt stream thu th p d li u ca các ph ươ ng th c write và writeln. write("str") vi t mt chu i vào mt tài li u writeln("str") vi t mt chu i vào mt tài li u và xu ng dòng 98
  99. CÁC I T ƯNG CÓ SN JAVASRIPT • S ki n tác ng i tưng document Cú pháp: document.event_name="someJavaScriptCode" OnMouseDown • OnBlur OnMouseMove • OnClick OnMouseOut • OnDblClick OnMouseOver • OnFocus OnMouseUp • OnKeyDown OnMouseUp OnKeyPress • 99 • OnKeyUp
  100. CÁC I T ƯNG CÓ SN JAVASRIPT • i tưng trình duy t (Navigator Object ) i tưng trình duy t ch a ng nh ng thông tin v trình duy t web ca client; 100
  101. CÁC I T ƯNG CÓ SN JAVASRIPT Thu c tính Mô t appName Tên trình duy t appVersion Phiên bn trình duy t cookieEnabled platform Nn ca h iu hành appCodeName Xác nh tên ni ti ca trình duy t (Atlas). 101
  102. CÁC I T ƯNG CÓ SN JAVASRIPT Navigator Object Exemple document.write("appCodeName = "+navigator.appCodeName + " "); document.write("appName = "+navigator.appName + " "); document.write("appVersion = "+navigator.appVersion + " "); document.write("userAgent = "+navigator.userAgent + " "); 102
  103. CÁC I T ƯNG CÓ SN JAVASRIPT • i tưng Window Là i tưng cao nh t trong mô hình DOM, là nơi ch a tt c các thành ph n ca trang web. – Các thu c tính ca Windows : Thu c tính Mô t Giá tr defaultStatus thi t lp chu i thông báo trên thanh tr ng thái Text status thi t lp thông báo ti th i im hi n hành Text location Xác nh v trí trang hi n ti trong ca s URL history Xác nh các ph n t trong history 103
  104. CÁC I T ƯNG CÓ SN JAVASRIPT alwaysLowered hi n th ca s bên dưi các ca s khác Yes/no alwaysRaised hi n th ca s trên tt c các ca s khác Yes/no Dependent Ca s này s óng khi ca s cha b óng Yes/no directories Hi n th Button th ư mc Yes/no fullscreen hi n th ch y màn hình Yes/no height thi t lp chi u cao ca ca s s nguyên hotkeys Cho phép dùng phím nóng Yes/no left Thi t lp k/cách t text n cnh ca s s nguyên 104
  105. CÁC I T ƯNG CÓ SN JAVASRIPT location hi n th hp location Yes/no menubar hi n th thanh menu bar Yes/no resizable Cho phép thay i kích th ưc ca s Yes/no scrolbars xu t hi n /không xu t hi n thanh cu n Yes/no status Hi n th thanh tr ng thái Yes/no titlebar hi n th thanh tiêu Yes/no toolbar hi n th thanh công c Yes/no width Xác nh rng ca ca s s nguyên closed tr v giá tr true, false. True khi ca s óng true, false 105
  106. CÁC I T ƯNG CÓ SN JAVASRIPT Ví d: window.defaultStatus=”String” window.status=”String” window.location=”URL” Có th m mt trang web mi bng lnh: window.location.href=”URL” 106
  107. CÁC I T ƯNG CÓ SN JAVASRIPT Ph ươ ng Th c Mô t alert("msg") Hi n Th hp th ai thông báo blur() Di chuy n con tr n ca s hi n hành clearinterval(ID) Hy th i gian ã thi t lp bng setinterval() clearTimeout(ID) Hy th i gian ã thi t lp bng setTimeout() close() óng ca s hi n hành confirm("msg") Hi n th hp th ai xác nh n vi hai nút Cancel và OK focus() ư a con tr v ca s hi nhành Di chuy n ca s n mt v trí mi mt an pixel so vi ca MoveBy(x,y) s hi n hành Di chuy n ca s qua trái và lên trên mt an pixel c th so MoveTo(x,y) vi ca s hi n hành. 107
  108. CÁC I T ƯNG CÓ SN JAVASRIPT URL : c trang web np vào ca s. open(URL,"windowname", WindowName: là tên ca s . "FeatureList") FeatureList : danh sách các thu c tính ca ca s: toolbars, menu, status . print() in ni dung trong ca s hi n hành. prompt("msg","reply") Hi n th hp tho i nh p li u setTimeout(func,millisec) Thi t lp th i gian mili giây gi 1 hàm Hy vi c download mt ca s. Tươ ng t nh ư vi c stop() óng mt ca s trình duy t. resizeBy(dx,dy) Thay i kích th ưc ca s sang ph i dx, dưi dy pixel resizeTo(x,y) Thay i kích th ưc x, y pixel scrollBy(dx,dy) cu n ni dung sang ph i dx, xu ng dưi dy pixel 108 scrollTo(x,y) cu n ni dung trên trang n v trí x,y
  109. CÁC I T ƯNG CÓ SN JAVASRIPT Ví d: Objwindow.close() T khoá self : trong tr ưng hp mu n thao tác trên ca s hi n hành ta dùng t khoá self thay th cho i tưng window Ví d: óng ca s hi n hành: Self.close() ho c window.close() 109
  110. CÁC I T ƯNG CÓ SN JAVASRIPT Ví d: on Script óng, m ca s trình duy t 110
  111. MÔ HÌNH I T ƯNG 111
  112. i tưng Form • Form là mt thành ph n dùng thu th p d li u, thông tin t ng ưi dùng. •Mi ph n t trong form là mt i tưng trong DOM. •Mi ph n t trên form cng có nh ng s ki n và ph ươ ng th c. – Các s ki n ca các ph n t trên form. 112
  113. i tưng form Ph n t Tên s ki n Button onClick Checkbox onClick Form OnSubmit, onReset Textbox OnBlur,OnChange,OnFocus,Onselect Radio OnClick Reset button OnClick Dropdown menu OnBlur,onChange,onFocus,onSelect Submit button OnClick Textarea OnBlur,OnChange,OnFocus,Onselect 113
  114. 2. Thu ộc tính của form T/tính Mô t Ví d Action Tr v ưng dn (URL) Document.forms[i].action n tp tin x lý ca form th i Length Tr v s form trên trang Countform=document.forms.length web Countfield=document.forms[i].length Ho c tr v s ph n t trên form th i Name Tr v giá tr tên ca Nameform=document.forms[i].name form th i Method Các nh ph ươ ng th c Methodform=document.forms[i].method ca form th i elements mng element ch a các document.forms[i].elements[j].value ph n t trên form 114
  115. Thu ộc tính của form Ví d: function kq() { sptform=document.form1.length document.form1.spt.value=sptform tenform=document.forms[0].name document.form1.formname.value=tenform } 115
  116. Các thu c tính trên mng element T/ tính Mô t Ví d Xác nh tên ca ph n t j document.forms[i].elements[j].name Name trên form th i. Xác nh lai ca i tưng document.forms[i].elements[j].type Type Xác nh giá tr ca ph n t th document.forms[i].elements[j].value j trong form i. Value 116
  117. Các thu c tính trên mng element Xác nh ph n t document.form[i]. Checked th j có ưc elements[j].checked checked không tr v giá tr true ho c false Thi t lp ch vô document.form[i].elements[j].disabled Disabled hi u hóa i tưng Ki m tra ph n t có document.form[i].elements[j].isDisable isDisable b vô hi u hóa hay không Cho phép/không readOnly thay i ni dung document.forms[i].elements[j].readOnly ca ph n t 117
  118. Các thu c tính trên mng element function loadform() Ví d: { document.form1.ok.disabled=true; } function validateform() { a=document.form1.user.value; if(a!="") document.form1.ok.disabled=false; else document.form1.ok.disabled=true; } 118
  119. Các thu c tính trên mng element – Ph ươ ng th c trên mng element • Focus(): ư a con tr v li text box ho c dropdownmenu document.forms[i].elements[j].focus() Ví d: document.form1.user.focus(); Lưu ý: Nu ta ang làm vi c trên document hi n hành, thì có th b qua document nameForm.nameField.property ho c nameForm.nameField.method 119
  120. Các ph n t trên form • Thao tác trên tr ưng radio ly giá tr ca tr ưng radio ta ph i s dng n mng element. Duy t qua tt c các ph n t và ki m tra ph n t ó có ưc checked không ? Cú pháp: Countfield=nameform.length for(var i=0 ; i<Countfield ; i++) Giatri=nameform.elements[i].value 120
  121. Các ph n t trên form Ví d: radio function chontrinhduyet() { count=document.form1.length; for(i=0; i 121
  122. Các ph n t trên form Ví d: Checkbox function check() { coffee=document.forms[0].coffee answer=document.forms[0].answer txt="" for (i = 0; i 122
  123. Các ph n t trên form • Thao tác trên dropdownmenu – Thu c tính và ph ươ ng th c ca dropdownmenu − Thuôc tính Thu c tính Mô t Ví d Tr v s ph n t trong spt=nameform.namefield .length length danh sách dropdownmenu. tr v ch s ca ph n t spt=nameform .namefield . selectedIndex ưc ch n trong danh sách selectedIndex mng option ưc ánh options ch s t 0->spt-1 123
  124. Các ph n t trên form Ví d: function chonkhoa() { option=document.forms[0].khoa.options[document. forms[0].khoa.selectedIndex].text txt=document.forms[0].chon.value txt=txt + option document.forms[0].chon.value=txt } 124
  125. THAY I N I DUNG NG TRÊN TRANG • ThIay i ni dung trên trang da vào inner và outer Ta dùng c tính inner và outer thay i ni dung ho c ly giá tr ca mt vùng nào ó trên trang web. Phân bi t gi a inner và outer • Inner là ni dung ch a bên trong c a i t ưng ch a ID . Inner g m có – InnerText : ch ly n i dung text bên trong i tưng ID – InnerHTML ly n i dung text và trong i t ưng ID 125
  126. THAY ĐỔI N ỘI DUNG ĐỘNG TRÊN TRANG • Outer là ph n inner và bn thân i t ưng ch a ID. Outer gm có – outerHTML ly ni dung text và tag HTML ca c i tưng ID – outerText : l y n i dung text Ví d: Monitor SAMSUNG 126
  127. THAY ĐỔI N ỘI DUNG ĐỘNG TRÊN TRANG Ví d: Var s1,s2 s1=Intro.outerText s2=Intro.innerText thì s1 và s2 u nh n giá tr Monitor SAMSUNG Ví d s1=Intro.outerHTML s2=Intro.innerHTML Thì s1= Monitor SAMSUNG Và s2=Monitor SAMSUNG 127
  128. : THAY ĐỔI N ỘI DUNG ĐỘNG TRÊN TRANG Ví dụ: thi ết kế form có dạng 128
  129. THAY ĐỔI N ỘI DUNG ĐỘNG TRÊN TRANG function chonsp() { prod=document.form1.masp.value; hinhsp=document.forms[0].hinh.options[document . forms[0].hinh.selectedIndex].text; price=document.form1.giasp.value; ma.innerText=prod; hinh.innerText=hinhsp; gia.innerText=price 129 }
  130. THAY ĐỔI N ỘI DUNG ĐỘNG TRÊN TRANG function ChangeImage(path) { h.innerHTML=" " } Gi hàm ChangeImage(value) hình 1 hình 2 hình 3 130