Đang tải... (xem toàn văn)
giáo án giảng dạy môn lập trình web GV trường đại học vinh Chuong04 Giới thiệu JavaScript Lập trình web bằng HTML giáo án giảng dạy môn lập trình web GV trường đại học vinh Chuong04 Giới thiệu JavaScript Lập trình web bằng HTML
ctsdhv@yahoo.com Web Design, 1st Edition. Chapter 4 Slide 1 WEB DESIGN CHƯƠNG 4: GIỚI THIỆU JAVASCRIPT CHƯƠNG 4: GIỚI THIỆU JAVASCRIPT ctsdhv@yahoo.com Web Design, 1st Edition. Chapter 4 Slide 2 Chương 4: Giới thiệu JavaScript I. Giới thiệu II. Nhập môn JavaScript III. Biến trong JavaScript IV. Các toán tử V. Các lệnh VI. Các thao tác trên đối tượng VII. Các ví dụ Nội dung chính ctsdhv@yahoo.com Web Design, 1st Edition. Chapter 4 Slide 3 Chương 4: Giới thiệu JavaScript JavaScript là ngôn ngữ dưới dạng kịch bản (script) có thể gắn liền với các file HTML. JavaScript có kịch bản ở trình khách (client). Thường đáp ứng các sự kiện mà HTML không hỗ trợ. Trình duyệt nào hỗ trợ JavaScript thì có thể thực hiện được các lệnh của JavaScript. I. Giới thiệu ctsdhv@yahoo.com Web Design, 1st Edition. Chapter 4 Slide 4 Chương 4: Giới thiệu JavaScript 1. Nhúng JavaScrip vào tệp HTML <Script Language="JavaScript"> <! From here the JavaScript code hidden // Insert All JavaScript code here //This is where the hidden ends > </Script> II. Nhập môn JavaScript ctsdhv@yahoo.com Web Design, 1st Edition. Chapter 4 Slide 5 Chương 4: Giới thiệu JavaScript 1. Nhúng JavaScrip vào tệp HTML Thường đặt đoạn JavaScript trong cặp thẻ <Head> … <Script Language="JavaScript"> …. </Script> </Head> II. Nhập môn JavaScript ctsdhv@yahoo.com Web Design, 1st Edition. Chapter 4 Slide 6 Chương 4: Giới thiệu JavaScript 2. Sử dụng một file nguồn JavaScript Kết nối một tệp file_name.js vào trang HTML như sau: <Script src="file_name.js"> …. </Script> II. Nhập môn JavaScript ctsdhv@yahoo.com Web Design, 1st Edition. Chapter 4 Slide 7 Chương 4: Giới thiệu JavaScript 3. Hiển thị một dòng text Đối tượng document trong JavaScript document.write("Text"); document.writeln("Text"); write(): Ghi dòng text, không xuống dòng writeln(): Ghi dòng text, xuống dòng II. Nhập môn JavaScript ctsdhv@yahoo.com Web Design, 1st Edition. Chapter 4 Slide 8 Chương 4: Giới thiệu JavaScript Ví dụ: <PRE> <SCRIPT LANGUAGE="JavaScript"> <! document.writeln("One,"); document.writeln("Two,"); document.write(" "); > </SCRIPT> </PRE> II. Nhập môn JavaScript ctsdhv@yahoo.com Web Design, 1st Edition. Chapter 4 Slide 9 Chương 4: Giới thiệu JavaScript 4. Hiển thị hộp thoại alert("Text"); Ví dụ: alert('Xin chao cac ban !'); Chúng ta thường dùng phương thức này để thông báo cho người dùng một thông tin nào đó. II. Nhập môn JavaScript ctsdhv@yahoo.com Web Design, 1st Edition. Chapter 4 Slide 10 Chương 4: Giới thiệu JavaScript 1. Biến và phân loại biến Bắt đầu bằng chữ hoặc dấu gạch dưới Biến toàn cục: x = 0; Biến cục bộ: var x = 0; 2. Kiểu dữ liệu Kiểu nguyên, Kiểu dấu phẩy động Kiểu logic (true, false) Kiểu xâu ( Ví dụ: "xâu" hoặc 'xâu') III. Biến trong JavaScript [...]... Chương 4: Giới thiệu JavaScript VI Các thao tác trên đối tượng 3 Một số sự kiện onmouseover: Khi chuột chuyển qua đối tượng onmouseout: Khi chuột ra khỏi đối tượng onclick: Khi nhấp chuột ondblclick: Khi nhấp đúp chuột onmouseup: Khi nhấp chuột ctsdhv@yahoo.com Web Design, 1st Edition Chapter 4 Slide 17 Chương 4: Giới thiệu JavaScript VII Các ví dụ 1 Sự kiện nhấp chuột ... Và || Hoặc ! Not ctsdhv@yahoo.com Web Design, 1st Edition Chapter 4 Slide 12 Chương 4: Giới thiệu JavaScript V Các lệnh 1 Câu lệnh điều kiện if ( ) { //Câu lệnh với điều kiện đúng } else { //Câu lệnh với điều kiện sai } ctsdhv@yahoo.com Web Design, 1st Edition Chapter 4 Slide 13 Chương 4: Giới thiệu JavaScript V Các lệnh 2 Vòng lặp For for (initExpr; ; incrExpr) { //Các câu... ctsdhv@yahoo.com Web Design, 1st Edition Chapter 4 Slide 14 Chương 4: Giới thiệu JavaScript V Các lệnh 3 Vòng lặp While Vòng lặp while lặp khối lệnh chừng nào còn được đánh giá đúng Cú pháp: while () { //Các câu lệnh thực hiện } ctsdhv@yahoo.com Web Design, 1st Edition Chapter 4 Slide 15 Chương 4: Giới thiệu JavaScript VI Các thao tác trên đối tượng 1 New Biến new được thực hiện...Chương 4: Giới thiệu JavaScript IV Các toán tử 1 Gán x = x + y (x += y); x = x - y (x -= y); … 2 So sánh = = true nếu toán hạng trái = toán hạng phải != Khác >, >=,