• Save
Bài 4 - Các đối tượng trong JAVASCRIPT - Học lập trình web cơ bản với Html, Css, Javascript
Upcoming SlideShare
Loading in...5
×
 

Bài 4 - Các đối tượng trong JAVASCRIPT - Học lập trình web cơ bản với Html, Css, Javascript

on

  • 324,144 views

Mục tiêu : ...

Mục tiêu :
Các đối tượng trong JavaScript
Sử dụng các đối tượng
Các sự kiện trên trang HTML
Kết hợp ngôn ngữ JavaScript, các đối tượng và các sự kiện trên web để xử lý các yêu cầu

Xem thêm tại http://www.hoclaptrinhweb.com

Statistics

Views

Total Views
324,144
Views on SlideShare
5,037
Embed Views
319,107

Actions

Likes
2
Downloads
0
Comments
0

5 Embeds 319,107

http://forum.hoclaptrinhweb.com 319079
http://htmlcomponentservice.appspot.com 13
http://static.wix.com 11
http://webcache.googleusercontent.com 3
http://violet.vn 1

Accessibility

Categories

Upload Details

Uploaded via as Microsoft PowerPoint

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment
  • Thời lượng : 17 tiết
  • Minhoa_Bai04_slide19.html
  • Minhoa_Bai04_slide20.html
  • Minhoa_Bai04_slide23.html
  • Minhoa_Bai04_slide24.html
  • Minhoa_Bai04_slide19.html Minhoa_Bai04_slide29.html
  • Minhoa_Bai04_slide23.html Minhoa_Bai04_slide30.html
  • Minhoa_Bai04_slide33.html
  • Minhoa_Bai04_slide37.html
  • Minhoa_Bai04_slide43.html
  • Minhoa_Bai04_slide45.html

Bài 4 - Các đối tượng trong JAVASCRIPT - Học lập trình web cơ bản với Html, Css, Javascript Bài 4 - Các đối tượng trong JAVASCRIPT - Học lập trình web cơ bản với Html, Css, Javascript Presentation Transcript

  • 11HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/
  • 22HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Mục tiêuMục tiêu• Các đối tượng trong JavaScript• Sử dụng các đối tượng• Các sự kiện trên trang HTML• Kết hợp ngôn ngữ JavaScript, các đốitượng và các sự kiện trên web để xử lýcác yêu cầu
  • 33HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Nội dungNội dung1. Các đối tượng cơ bản1. Các đối tượng cơ bản1. Các đối tượng cơ bản1. Các đối tượng cơ bản2. Các đối tượng trong JavaScript2. Các đối tượng trong JavaScript2. Các đối tượng trong JavaScript2. Các đối tượng trong JavaScript3. Các sự kiện trên trang HTML3. Các sự kiện trên trang HTML3. Các sự kiện trên trang HTML3. Các sự kiện trên trang HTML
  • 44HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Các đối tượng cơ bảnCác đối tượng cơ bản• String• Date• Math
  • 55HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/− JavaScript là ngôn ngữ lập trình dựa trên đối tượng(Object-based language)− Các đối tượng trong JavaScript (Math, String, …) giúpngười lập trình xử lý cắt chuỗi, sử dụng các hàm toánhọc, …− JavaScript sẽ dựa vào giá trị của biến để xác định biếnđó thuộc đối tượng nàoBài 4: Các đối tượng trong JavascriptCác đối tượng cơ bản
  • 66HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• String− Xử lý chuỗi văn bản− Thuộc tính:• length : trả về tổng số ký tự của chuỗiBài 4: Các đối tượng trong JavascriptCác đối tượng cơ bảnvar <tên biến> = new String;hoặc var <tên biến> = new String(“chuỗi khởi tạo”);Ví dụ:var chuoi = new String(“Lập trình web cơ bản”);
  • 77HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• String− Phương thức:Vị trí của ký tự đầu tiên trong chuỗi luôn bắt đầu bằng chỉ số 0• search(<regExp>): tìm một “chuỗi” và trả về chỉ số tìm được.Nếu không tìm thấy, trả về -1 <regExp>: là một biểu thức có qui tắc, chứa /chuỗi tìm/ vàoption /i ; cho phép tìm theo chữ HOA/thườngBài 4: Các đối tượng trong JavascriptCác đối tượng cơ bảnVí dụ: tìm chữ “Tâm” trong chuỗi “Chữ tâm kia mới bằng ba chữ tài”var chuoi = new String("Chữ tâm kia mới bằng ba chữ tài");n = chuoi.search(/Tâm/i)alert(n);  4
  • 88HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• String− Phương thức:• replace(<regExp>,”chuỗi thế”): tìm và thay thế. <regExp>: chứa /chuỗi tìm/ , option /i ; cho phép tìm theo chữHOA/thường, và option /g ; cho phép thay thế toàn bộBài 4: Các đối tượng trong JavascriptCác đối tượng cơ bảnVí dụ: thay thế toàn bộ chữ “Mẹ” thành “Má” trong 2 câu đầu của bàihát “Mẹ dấu yêu”var chuoi =new String("Mẹ là làn gió mát, đưa con giấc ngủngoan; Mẹ là dòng suối trong, cho con luôn tìm về");str = chuoi.replace(/mẹ/gi,"Má")
  • 99HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Các đối tượng cơ bảnCác đối tượng cơ bản• String• Date• Math
  • 1010HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Date− Dùng để xử lý dữ liệu kiểu thời gian• <tháng> được tính từ 0 ; tháng 1Bài 4: Các đối tượng trong JavascriptCác đối tượng cơ bảnvar <tên biến> = new Date();hoặc var <tên biến> = new Date(năm, tháng, ngày);
  • 1111HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Date− Phương thức• getDay(): trả về thứ tự ngày trong tuần ( 0  6), 0 bắt đầu làChủ nhật• getMonth(): trả về số tháng trong năm ( 0  11), 0 bắt đầutháng 1Bài 4: Các đối tượng trong JavascriptCác đối tượng cơ bảnVí dụ: in thứ tự ngày trong tuần của ngày sinh 25/05/2008var ngaysinh = new Date(2008,4,25)thu = ngaysinh.getDay()alert(thu);  0
  • 1212HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Các đối tượng cơ bảnCác đối tượng cơ bản• String• Date• Math
  • 1313HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Math− Các xử lý liên quan đến toán học− Không cần khai báo và khởi tạo− Thuộc tính:Bài 4: Các đối tượng trong JavascriptCác đối tượng cơ bản
  • 1414HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Math− Phương thức:Bài 4: Các đối tượng trong JavascriptCác đối tượng cơ bảnVí dụ: phát sinh một số nguyên ngẫu nhiên trong khoảng từ 10 đến100var so = parseInt(Math.random()*91 +10);Ví dụ:Math.round(3.4)  3Math.round(3.5)  4
  • 1515HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Nội dungNội dung1. Các đối tượng cơ bản1. Các đối tượng cơ bản1. Các đối tượng cơ bản1. Các đối tượng cơ bản2. Các đối tượng trong JavaScript2. Các đối tượng trong JavaScript2. Các đối tượng trong JavaScript2. Các đối tượng trong JavaScript3. Các sự kiện trên trang HTML3. Các sự kiện trên trang HTML3. Các sự kiện trên trang HTML3. Các sự kiện trên trang HTML
  • 1616HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Các đối tượng trong JavaScriptCác đối tượng trong JavaScript• Mô hình BOM - Browser Object Model• Mô hình DOM - Document Object Model• Tham chiếu đến một đối tượng trong DOM
  • 1717HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/− Sắp xếp theo hệ thống phân cấp (hierarchy) và bắt đầu làđối tượng windowBài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScript
  • 1818HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Mô hình BOM - Browser Object ModelBài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScript
  • 1919HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Mô hình BOM - Browser Object Model− window: đại diện cho cửa sổ trình duyệt• Thuộc tính status, history, location• Phương thức close, open, setInterval, setTimeout, …• Sự kiện:Bài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScriptMinh họaMinh họa
  • 2020HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Mô hình BOM - Browser Object Model− navigator: cung cấp thông tin về trình duyệt và hệ thốngtại máy client• Thuộc tính:Bài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScriptMinh họaMinh họa
  • 2121HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Mô hình BOM - Browser Object Model− location: chứa thông tin về URL hiện hành, thường sửdụng để di chuyển đến một trang web khác• Thuộc tính: protocol, hostname, port, …• Phương thức:Bài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScriptVí dụ: khi nhấn nút Hoc Lap Trinh Web, thế trang hiện hành bằng trangweb của Hoc Lap Trinh Web<form><input type="button" value=“Hoc Lap Trinh Web"onClick="location.replace(http://www.hoclaptrinhweb.com)"></form>
  • 2222HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Mô hình BOM - Browser Object Model− event: được hỗ trợ từ IE 5.0 và Netscape 6.0 trở lên,dùng để lưu vết các sự kiện xảy ra trên trang web nhưnhấn chuột, di chuyển chuột, …Bài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScript
  • 2323HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Mô hình BOM - Browser Object Model− event:• Thuộc tính:Bài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScriptÁp dụng cho IE 5.0+Minh họaMinh họa
  • 2424HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Mô hình BOM - Browser Object Model− event:• Thứ tự xảy ra trên cùng một kiểu sự kiện của các elementtrong một trang webBài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScriptMinh họaMinh họa
  • 2525HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Các đối tượng trong JavaScriptCác đối tượng trong JavaScript• Mô hình BOM - Browser Object Model• Mô hình DOM - Document Object Model• Tham chiếu đến một đối tượng trong DOM
  • 2626HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Mô hình DOM - Document Object Model− Phản ánh cấu trúc của một tài liệu HTML− Được phép thêm, xóa hoặc cập nhật các đối tượng trongDOMBài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScript
  • 2727HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Mô hình DOM - Document Object Model− document: đại diện cho toàn bộ trang HTML• Thuộc tính tập hợp: thường dùng để xác định một phần tử hoặcduyệt các phần tử trong một tập hợpBài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScriptVí dụ: duyệt và in tên các tag <a> ra màn hình<body><a name="first"> anchor đầu tiên</a><br /><a name="second">anchor thứ hai</a><br /><a name="third"> anchor thứ ba</a><br /><script type="text/javascript">for (var i=0; i<=document.anchors.length -1 ; i++)document.write(document.anchors[i].name + "<br>")</script> </body>
  • 2828HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Mô hình DOM - Document Object Model− document: đại diện cho toàn bộ trang HTML• Thuộc tính: title, URLBài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScript
  • 2929HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Mô hình DOM - Document Object Model− document: đại diện cho toàn bộ trang HTML• Phương thức:Bài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScriptMinh họaMinh họaMinh họaMinh họa
  • 3030HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Mô hình DOM - Document Object Model− document: đại diện cho toàn bộ trang HTML• Sự kiện:Bài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScriptMinh họaMinh họaMinh họaMinh họa
  • 3131HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Các đối tượng trong JavaScriptCác đối tượng trong JavaScript• Mô hình BOM - Browser Object Model• Mô hình DOM - Document Object Model• Tham chiếu đến một đối tượng trong DOM
  • 3232HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Tham chiếu đến một đối tượng trong DOM− Tham chiếu một đối tượng của documentBài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScriptdocument.<tên t.tính tập hợp>[“tên đ.tuợng”|<chỉ số>].<t.tính>hoặcdocument.<tên t.tính tập hợp>.<tên đ.tuợng>.<thuộc tính>Ví dụ:document.images[‘hinh1’].srcdocument.images[0].namedocument.images.hinh1.src
  • 3333HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Tham chiếu đến một đối tượng trong DOM− Tham chiếu một đối tượng của formBài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScriptdocument.forms[“tên form”|<chỉ số>].<đ.tượng>.<thuộc tính>Ví dụ:document.forms[nhap].ks.checkedMinh họaMinh họa
  • 3434HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Tham chiếu đến một đối tượng trong DOM− Điều khiển Drop-down List:• Truy xuất một mục bất kỳBài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScriptdocument.forms[“tên form”|<chỉ số>].<đ.tượng>.options[<chỉ số>].<t.tính>hoặcdocument.forms.<tên form>.<đ.tượng>.options[<chỉ số>].<thuộc tính>Ví dụ:var nd = document.forms[nhap].thuc_an.options[1].innerTexthoặcvar nd = document.forms.nhap.thuc_an.options[1].innerText
  • 3535HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Tham chiếu đến một đối tượng trong DOM− Điều khiển Drop-down List:• Duyệt và kiểm tra từng mụcBài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScript<biến> = document.getElementById(id của tag <select>);for (i=0; i< <biến>.length; i++ ){ if (<biến>.options[i].selected) //mục thứ i đựơc chọn{/* Khối lệnh xử lý */}}
  • 3636HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Tham chiếu đến một đối tượng trong DOM− Điều khiển Drop-down List:• Thêm một mụcBài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScriptdocument.forms[tên form].<đ.tượng>.options[<chỉ số>]=new Option(<nội dung>, <giá trị>);
  • 3737HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Tham chiếu đến một đối tượng trong DOM− Điều khiển Drop-down List:• Xóa một mụcBài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScriptdocument.forms[tên form].<đối tượng>.options[<chỉ số>]= null;hoặc<biến> = document.getElementById(id của tag <select>);<biến>.remove(<chỉ số>);Minh họaMinh họa
  • 3838HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Tham chiếu đến một đối tượng trong DOM− Điều khiển Drop-down List:• Xóa tất cả các mụcBài 4: Các đối tượng trong JavascriptCác đối tượng trong JavaScriptdocument.forms[tên form].<đối tượng>.options.length= 0;
  • 3939HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Nội dungNội dung1. Các đối tượng cơ bản1. Các đối tượng cơ bản1. Các đối tượng cơ bản1. Các đối tượng cơ bản2. Các đối tượng trong JavaScript2. Các đối tượng trong JavaScript2. Các đối tượng trong JavaScript2. Các đối tượng trong JavaScript3. Các sự kiện trên trang HTML3. Các sự kiện trên trang HTML3. Các sự kiện trên trang HTML3. Các sự kiện trên trang HTML
  • 4040HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Các sự kiện trên trang HTMLCác sự kiện trên trang HTML• Sự kiện của window – Window Events• Sự kiện của các điều khiển trên form• Sự kiện phím – Keyboard Events• Sự kiện chuột – Mouse Events
  • 4141HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Sự kiện của window – Window Events(xem lại mục đối tượng Window trong Mô hình BOM)Bài 4: Các đối tượng trong JavascriptCác sự kiện trên trang HTML
  • 4242HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Các sự kiện trên trang HTMLCác sự kiện trên trang HTML• Sự kiện của window – Window Events• Sự kiện của các điều khiển trên form• Sự kiện phím – Keyboard Events• Sự kiện chuột – Mouse Events
  • 4343HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Sự kiện của các điều khiển trên form− onchange: khi thay đổi nội dung của điều khiển− onfocus: khi điều khiển nhận được focus− onblur: khi điều khiển mất đi focusBài 4: Các đối tượng trong JavascriptCác sự kiện trên trang HTMLMinh họaMinh họa
  • 4444HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Các sự kiện trên trang HTMLCác sự kiện trên trang HTML• Sự kiện của window – Window Events• Sự kiện của các điều khiển trên form• Sự kiện phím – Keyboard Events• Sự kiện chuột – Mouse Events
  • 4545HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Sự kiện phím – Keyboard Events− Các sự kiện: onkeydown, onkeypress, onkeyup− Thường áp dụng cho đối tượng document, form và cácđiều khiển trên formBài 4: Các đối tượng trong JavascriptCác sự kiện trên trang HTMLVí dụ:Chỉ cho phép nhập số, nếu nhập ký tự thì vô hiệu hóa phím nhấnMinh họaMinh họa
  • 4646HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Các sự kiện trên trang HTMLCác sự kiện trên trang HTML• Sự kiện của window – Window Events• Sự kiện của các điều khiển trên form• Sự kiện phím – Keyboard Events• Sự kiện chuột – Mouse Events
  • 4747HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/• Sự kiện chuột – Mouse Events(xem lại mục đối tượng Document trong mô hình DOM)Bài 4: Các đối tượng trong JavascriptCác sự kiện trên trang HTML
  • 4848HỌC LẬP TRÌNH WEB TỪ CƠ BẢN ĐẾN NÂNG CAOHocLapTrinhWeb.COMα - Tek http://www.facebook.com/groups/hoclaptrinhweb/Bài 4: Các đối tượng trong JavaScriptHẾTHẾT