Bài giảng HTML - Bài 7: Làm việc với Javascript - Lê Quang Lợi

Nội dung text: Bài giảng HTML - Bài 7: Làm việc với Javascript - Lê Quang Lợi

1. Lê Quang Lợi
2. Bài 07: Làm việc với javascript Nội dung » Hàm trong javascript » Sự kiện trong javascript Lê Quang Lợi: loilequang@gmail.com HTML-DHTML-Javascript CNPM-CNTT-ĐHSPKT HY
3. 7.1 Hàm » Hàm :là một đơn vị chương trình thực hiện các tác vụ nhỏ » Hàm có thể cài đặt các sự kiện cho thẻ: click, double click » Cấu trúc hàm: tên, đối, nội dung, giá trị trả về » Hàm xây dựng sẵn: alert, eval, IsNaN, length, Maht.sqrt() » Hàm tự xây dựng: do người lập trình viết theo yêu cầu cụ thể » Hàm cài đặt nội dung các sự kiện trong tài liệu HTML Lê Quang Lợi: loilequang@gmail.com HTML-DHTML-Javascript CNPM-CNTT-ĐHSPKT HY
4. 7.1.1 Tạo hàm » Cấu trúc hàm function tenham(*đối+), function Add(a,b) { return a+b; // khối lệnh } *return giá trị;+ var sum = Add(5,10); // khối lệnh } » Từ khóa: function cho phép định nghĩa hàm . Tên hàm đại diện cho nội dung . Nội dung nằm trong cặp “,“ và “ -” . Từ khóa return cho phép thoát hàm và gán giá trị cho hàm Lê Quang Lợi: loilequang@gmail.com HTML-DHTML-Javascript CNPM-CNTT-ĐHSPKT HY
5. 7.1.2 Gọi Hàm Cách gọi tenham(); // gọi hàm không đối tenham(danh sách đối);// gọi hàm có đối var kq=tenham(danh sách đối);// gọi hàm có đối và có giá //trị trả về Chú ý: - hàm có thể được gọi trong thẻ script - hàm có thể được gọi trong thuộc tính thẻ HTML Lê Quang Lợi: loilequang@gmail.com HTML-DHTML-Javascript CNPM-CNTT-ĐHSPKT HY
6. 7.2 Hàm nắm bắt sự kiện cho thẻ HTML » Sự kiện: Hành động khi tương tác với giao điện HTML » Sự kiện bàn phím: OntextChange, » Sự kiện cho chuột: OnCLick, DoubleClick, MouseOver function myClick(){alert(“chào các bạn”);} Lê Quang Lợi: loilequang@gmail.com HTML-DHTML-Javascript CNPM-CNTT-ĐHSPKT HY
7. 7.2.1 quy trình bắt sự kiện trong javascript B01: Tạo hàm xử lý sự kiện function tenham(){ // nội dung} B02: Cài đặt thuộc tính sự kiện với hàm tương ứng B03: Xây dựng nội dung hàm xử lý sự kiện * Lấy về dữ liệu từ tag:getElementByID * Thay đổi nội dung thẻ HTML: innerHTML, innerText, Value Lê Quang Lợi: loilequang@gmail.com HTML-DHTML-Javascript CNPM-CNTT-ĐHSPKT HY
8. 7.2.2 Ví dụ về bắt sự kiện Lê Quang Lợi: loilequang@gmail.com HTML-DHTML-Javascript CNPM-CNTT-ĐHSPKT HY