Giáo trình lập trình mạng pptx

TRƯỜNG KHOA……………… WX Giáo trình Lập trình mạng Bài giảng môn học: Lập trình mạng GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 1 MỤC LỤC Chương 1- Mở đầu 4 1.1. Mạng máy tính và lịch sử phát triển 4 1.2. Mô hình WWW (world wide web) và các dịch vụ liên quan 4 1.3. Thế nào là trang web tĩnh, trang web động 4 1.4. Các bước phát triển của web 5 1.5. Các công cụ và công nghệ thiết kế web 5 Chương 2- Ngôn ngữ HTML 6 2.1. Thẻ (tag) HTML là gì? 6 2.2. Cấu trúc của một trang HTML 6 2.3. Các thẻ định cấu trúc tài liệu 6 2.4. Các thẻ định dạng 7 2.5. Thẻ tạo link (liên kết) 8 2.6. Thẻ tạo frame (khung) 8 2.7. Thẻ tạo Form 9 2.8. Thẻ tạo đối tượng FORM 9 2.9. Thẻ Marquee-tạo chữ chạy 11 2.10. Các thẻ tạo bảng 11 2.11. Một số thẻ Multimedia 11 2.12. Bảng mã và tên gọi trong HTML của một số ký tự đặc biệt 13 2.13. Thiết kế web sử dụng Microsoft Frontpage 13 2.13.1. Các thao tác chính khi soạn thảo một trang web 13 2.13.2. Tạo các thành phần của trang web 14 2.14. Bài tâp thực hành 15 2.14.1. Tạo trang web cho nhóm. 15 2.14.2. Tham khảo các site 16 2.14.3. Thiết kế websitte theo các mẫu 17 Chương 3- Ngôn ngữ kịch bản Javascript 22 3.1. Tổng quan về JavaScript 22 3.2. Nhúng JavaScript vào trang tài liệu HTML 22 3.2.1. Sử dụng thẻ <SCRIPT> 22 3.2.2. Sử dụng một file nguồn JavaScript 23 3.2.3. Sử dụng thẻ <Noscript> 23 3.3. Hiển thị dòng Text 23 3.4. Giao tiếp với người sử dụng 24 3.5. Khai báo biến 25 3.6. Kiểu dữ liệu 25 3.6.1. Kiểu nguyên (INTERGER) 25 3.6.2. Kiểu dấu phNy động (FLOATIN G POIN T) 25 3.6.3. Kiểu LOGIC (BOOLEAN ) 25 3.6.4. Kiểu chuỗi (STRIN G) 25 3.7. Các toán tử 26 3.8. Cấu trúc lệnh 27 3.8.1. Câu lệnh rẽ nhánh 27 3.8.2. Câu lệnh lặp 28 3.8.3. Câu lệnh break và continue 29 3.9. Hàm 29 3.9.1. Khai báo hàm 29 3.9.2. Các hàm có sẵn 29 3.10. Các lệnh thao tác trên đối tượng 29 3.10.1. for … in 29 Bài giảng môn học: Lập trình mạng GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 2 3.10.2. new 30 3.10.3. this 31 3.10.4. with 31 3.11. Khai báo dữ liệu kiểu mảng 32 3.12. Xử lý sự kiện 32 3.13. Các đối tượng trong Javascript 36 3.13.1. Đối tượng navigator 37 3.13.2. Đối tượng window 38 3.13.3. Đối tượng location 40 3.13.4. Đối tượng frame 40 3.13.5. Đối tượng DOCUMEN T 43 3.13.6. Đối tượng anchors 44 3.13.7. Đối tượng FORMS 44 3.13.8. Đối tượng HISTORY 45 3.13.9. Đối tượng LIN KS 46 3.13.10. Đối tượng MATH 46 3.13.11. Đối tượng DATE 47 3.13.12. Đối tượng STRIN G 48 3.13.13. Xem lại các lệnh và mở rộng 49 3.14. Mô hình đối tượng (OBJECT MODEL) 51 3.14.1. Đối tượng và thuộc tính 51 3.14.2. Tạo các đối tượng mới 52 3.15. Bài tập thực hành 57 3.15.1. Bài Tập 1 57 3.15.2. Bài tập 2 57 3.15.3. Bài tập 3 57 3.15.4. Bài tập 4 58 3.15.5. Bài tập 5 59 3.15.6. Bài tập 6 60 3.15.7. Bài tập 7 62 3.15.8. Bài tập 8 63 3.15.9. Bài tập 9 64 3.15.10. Bài tập 10 65 3.15.11. Bài tập 11 66 3.15.12. Bài tập 12 67 3.15.13. Bài tập 13 69 3.15.14. Bài tập 15 70 3.15.15. Bài tập 15 70 3.15.16. Bài tập 16 71 3.15.17. Bài tập 17 72 3.15.18. Bài tập 18 72 Chương 4- Lập trình web động với ASP (Active Server Page) 75 4.1. Giới thiệu ngôn ngữ lập trình web động ASP 75 4.2. Web Server IIS 76 4.3. Cài đặt và chạy ứng dụng ASP đầu tiên 79 4.3.1. Cấu hình cho Website trên IIS 80 4.3.2 Viết các file ASP 81 4.3.3 Dùng trình duyệt truy cập website 81 4.4. Tóm tắt các cú pháp VBScript 84 4.4.1. Response.write 85 4.4.2. Biến 85 4.4.3. Mảng 85 Bài giảng môn học: Lập trình mạng GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 3 4.4.4. Ghép chuỗi 85 4.4.5. Hàm có sẵn 86 4.4.6. Rẽ nhánh 88 4.4.7. Lặp 88 4.4.8. Điều kiện and ,or, not 89 4.4.9. Thủ tục và hàm người dùng 89 4.4.10. Sử dụng #include 91 4.5. Các đối tượng căn bản 91 4.5.1. Đối tượng Request 91 4.5.2. Response 93 4.5.3. Đối tượng Session 93 4.5.4. Đối tượng Application 94 4.5.5. File Global.asa 95 4.5.6. Đối tượng Dictionary 96 4.5.7. Đối tượng Server 96 4.5.7.1. Server.CreateObject 96 4.5.7.2. Server.Mappath 97 4.6. Sử dụng Database với ASP 97 4.6.1. Các cú pháp căn bản để truy xuất dữ liệu từ DB 97 4.6.2. Đối tượng Connection 97 4.6.3. Đối tượng Recordset 98 4.6.4. Tìm kiếm dữ liệu trong database 101 PHỤ LỤC 102 Phụ lục 1: Bài tập truy nhập các điều khiển trên Form 102 Phụ lục 2: Thiết kế form đăng nhập cho phép lưu lại tên tài khoản và mật khNu 104 Phụ lục 3: Hiển thị ảnh quảng cáo và số lượt truy cập 107 Phụ lục 4: Bài tập ADO, Phân trang với Recordset 108 Bài giảng môn học: Lập trình mạng GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 4 Chương 1- Mở đầu Yêu cầu: Giáo viên cần trình bày và trao đổi với sinh viên để sinh viên nắm được các kiển thức tổng quan sau: 1.1. Mạng máy tính và lịch sử phát triển - Mạng máy tính là một tập các máy tính được kết nối với nhau thông qua các phương tiện truyền dẫn vật lý (như các loại cáp đồng, cáp quang, sóng vô tuyến, …) - Lịch sử phát triển mạng máy tính: o Mạng trong Bộ quốc phòng của Mỹ o Triển khai nghiên cứu tại các trường Đại học ở Mỹ o Phát triển trên các châu lục và trở thành mạng Internet - Việt N am chính thức kết n ối internet tháng 12/1997 1.2. Mô hình WWW (world wide web) và các dịch vụ liên quan - Xét mô hình Client/Server - Bộ giao thức TCP/IP - Mô hình WWW - Các dịch vụ liên quan: HTTP(Hyper Text Transfer Protocol), Email, Chat, FTP(File Transfer Protocol), Hosting, Domain,… 1.3. Thế nào là trang web tĩnh, trang web động - Trang web tĩnh là trang web mà nội dung của nó được chuNn bị sẵn trên Server. Khi người sử dụng yêu cầu thì toàn bộ nội dung của trang sẽ được gửi về trình duyệt của máy khách. o Ví dụ: o Các ưu, nhược điểm của web tĩnh - Trang web động là trang web mà nội dung của nó không được chuNn bị sẵn trên server, nó chỉ được tạo ra khi người sử dụng yêu cầu. Server khi nhận được yêu c ầu từ Client sẽ thực hiện truy vấn dữ liệu từ CSDL (trên server hoặc từ server khác) theo yêu cầu, sau đó kết xuất tạo thành nội dung của trang và gửi về trình duyệt máy Client để xử lý tiếp o Ví dụ: o Các ưu, nhược điểm cuae web động Bài giảng môn học: Lập trình mạng GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 5 1.4. Các bước phát triển của web - Website truyền thống: Không có sự quản lý, phân loại thông tin rõ ràng vì thế rất khó khăn trong việc tra cứu tìm kiếm thông tin - Website thông minh: Có sự quản lý và phân loại thông tin nên rất dễ dàng trong việc tra cứu, tìm kiếm thông tin - Portal (cổng): Mọi yêu cầu của người dùng đều có thể thực hiện trên web Portal. Hiện nay đa phần các web được xây dựng theo công nghệ Portal. Portal được chia làm 2 loại: Portal cổng ngang và Portal cổng dọc o Portal cổng ngang: phục vụ nhữ ng người có khả năng sử dụng máy tính và Internet. Ví dụ: www.yahoo.com o Portal cổng dọc: phục vụ một nhóm người trong một phạm vi công việc nào đó. Ví dụ: Cổng thông tin điện tử hỗ trợ giao dịch, nghiệp vụ, kỹ thuật, … giữa các nhà điều hành của một công ty với các nhân viên trong cơ quan. - Chú ý hiểu và phân biệt các khái niệm o Cổng thông tin điện tử o Cổng giao d ịch điện tử o Chính phủ điện tử o Thương mại điện tử o … 1.5. Các công cụ và công nghệ thiết kế web - N gôn ngữ lập trình : o HTML (Hypertext Markup Language) o Javascript o Vbscript o ASP (Active Server Pages), ASP.N ET o PHP o Java, JSP,… - Các công cụ thiết kế : o Microsoft Fronpage o Macromedia Dreamweaver o Web Matrix (dùng cho ASP.N ET), Bài giảng môn học: Lập trình mạng GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 6 Chương 2- Ngôn ngữ HTML 2.1. Thẻ (tag) HTML là gì? Để biểu diễn thông tin trên trang web, www sử dụng ngôn ngữ HTML để trình bày thông tin. Mỗi thông tin chi tiết sẽ được trình bày và định dạng dựa vào một cặp thẻ (tag) HTML tương ứng. - Mỗi cặp thẻ bao gồm: thẻ mở và thẻ đóng. Tên thẻ mở và thẻ đóng giống nhau và được đặt tỏng cặp dấu <tên thẻ> - Trong thẻ mở có thể có thêm các tham số phía sau tên thẻ - Trong thẻ đóng có thêm dấ u / phía trước tên thẻ - Dữ liệu cần trình bày đặt trong cặp thẻ mở và thẻ đóng - Có một số thẻ không nhất thiết phải viết cả thẻ đóng - Có thể đặt các cặp thẻ HTML lồng nhau Cấu trúc chung của một thẻ (tag) HTML như sau: <Ten_The thamso1=giatri1 thamso2=giatri2 …> Thông tin cần trình bày </Ten_The> Ví dụ: <B>chữ đậm</B> <I>chữ nghiêng</I> <U>chữ gạch chân <U> <B><I>chữ vừa đậm vừa nghiêng</I></B> 2.2. Cấu trúc của một trang HTML <html> <head> <title>Tiêu đề trang web</title> </head> <body> N ội dung trang web </body> </html> 2.3. Các thẻ định cấu trúc tài liệu - <HTML> </HTML> - <HEAD> </HEAD> - <TITLE> </TITLE> - <BODY> </BODY> Các tham số của thẻ <BODY> Bài giảng môn học: Lập trình mạng GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 7 2.4. Các thẻ định dạng - <P> </P> - Các thẻ định dạng đề mục - <BR> - <B>,<I>,<U>,<S> - <SUP>chỉ số trên</SUP>,<SUB>chỉ số dưới</SUB> - Căn lề văn bản trên trang web: tham số ALIGN , thẻ <CEN TER> - Định dạng Font chữ: + Dùng thẻ META <meta http-equiv="Content-Language" content="en-us"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> Thẻ này đặt trong cặp thẻ <HEAD> + Thẻ <FON T> </FON T>: Các thuộc tính: Attribute Example Purpose size="number" size="2" Defines the font size size="+number" Size="+1" Increases the font size size="-number" Size="-1" Decreases the font size face="face-name" face="Times" Defines the font-name color="color-value" color="#eeff00" Defines the font color color="color-name" color="red" Defines the font color Ví dụ: <p> <font size="2" face="Verdana"> This is a paragraph. </font> </p> <p> <font size="3" face="Times"> This is another paragraph. </font> Bài giảng môn học: Lập trình mạng GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 8 </p> - <HR> tạo dòng kẻ ngang 2.5. Thẻ tạo link (liên kết) <A HREF=url N AME=name TABIN DEX=n TITLE=title TARGET=_blank|_self|tên frame> dòng văn bản </A> Trong đó: - HREF Địa chỉ của trang Web được liên kết, là một URL nào đó. - N AME Đặt tên cho vị trí đặt thẻ. - TABLEIN DEX Thứ tự di chuyển khi ấn phím Tab - TITLE Văn bản hiển thị khi di chuột trên siêu liên kết. - TARGET Mở trang Web đ-ợc liên trong một cửa sổ mới (_blank) hoặc trong cửa sổ hiện tại (_self), trong một frame (tên frame). Ghi chú: N ếu đặt thuộc tính href= của thẻ <a> giá trị mailto:address@domain thì khi kích hoạt kết nối sẽ kích hoạt chức năng thư điện tử của trình duyệt. Ví dụ: <ADDRESS> Trang WEB này được <A href=”mailto:webmaster@vnuh.edu.vn” > WEBMASTER <\A> bảo trì <\ADDRESS> Khi nhấn vào dòng chữ WEBMASTER (dòng chữ này sẽ xuất hiện giống như các siêu liên kết khác) chức năng thư tín của trình duyệt sẽ được kích hoạt và địa ch ỉ thư điện tử webmaster@vnuh.edu.vn sẽ được chèn vào địa chỉ nhận thư của chương trình gửi thư. 2.6. Thẻ tạo frame (khung) Có thể thực hiện việc chia cửa sổ trình duyệt ra làm nhiều khung khác nhau gọi là frame. Trong mỗi khung cho phép hiển thị một trang web khác nhau. Ví dụ: <html> <head> </head> <frameset rows="64,*"> <frame name="tren" scrolling="no" noresize target="phai" src="tieude.htm"> <frameset cols="150,*"> <frame name="phai" target="trai" src="khungphai.htm"> <frame name="trai" src="khungtrai.htm"> </frameset> <noframes> <body> Bài giảng môn học: Lập trình mạng GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 9 <p>This page uses frames, but your browser doesn't support them.</p> </body> </noframes> </frameset> </html> Ghi chú: - Thẻ <FRAME> dùng để tạo ra các FRAME cụ thể - <FRAMESETS> được viết để chứa các thẻ <FRAME> trong nó (ít nhất 2 FRAME trở lên) - <N OFRAMES> để hiển thị thông báo trong trường hợp trình duyệt không hỗ trợ FRAME - Lưu ý cách truyền giá trị cho thuộc tính TARGET 2.7. Thẻ tạo Form Để tạo ra một form trong tài liệu HTML, chúng ta sử dụng thẻ FORM với cú pháp như sau: Trong đó: 2.8. Thẻ tạo đối tượng FORM Các đối tương form bao gồm: Ô nhập văn bản 1 dòng, Ô nhập văn bản nhiều dòng, Radio, Checkbox, Button, Drop down, List, … 9 Cú pháp thẻ <Input> [...]... một đoạn mã lệnh (gọi là các chương trình xử lý sự kiện) giúp cho chương trình có thể phản ứng một cách thích hợp GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 32 Bài giảng môn học: Lập trình mạng Chương trình xử lý sự kiện (Event handler): Một đoạn mã hay một hàm được thực hiện để phản ứng trước một sự kiện gọi là chương trình xử lý sự kiện Chương trình xử lý sự kiện được xác định là... giảng môn học: Lập trình mạng 2 Thiết kế website theo mẫu sau (http://www.flowers.com) 3 Thiết kế website theo mẫu sau (http://shopping.yahoo.com) GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 18 Bài giảng môn học: Lập trình mạng 4 Thiết kế website theo mẫu sau (http://www.is-edu.hcmuns.edu.vn) 5 Thiết kế website theo mẫu sau (http://vnexpress.net) GV: Lê Anh Tú - Bộ môn Mạng & Truyền... Khoa CNTT - ĐHTN 19 Bài giảng môn học: Lập trình mạng 6 Thiết kế website theo mẫu sau (http://www.codeproject.com) 7 Thiết kế website theo mẫu sau (http://www.bttvn.com ) - Để tham khảo cách thiết kế các trang web trên, hãy: o Tải về máy bằng cách chọn chức năng Save của IE GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 20 Bài giảng môn học: Lập trình mạng o Dùng MS Front Page để mở tập...Bài giảng môn học: Lập trình mạng Ví dụ: Kết quả: Cú pháp thẻ GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 10 Bài giảng môn học: Lập trình mạng Cú pháp thẻ 2.9 Thẻ Marquee-tạo chữ chạy trên một dòng riêng ngay trước thẻ để trình duyệt bỏ không thực hiện các mã JavaScript khi gặp chúng Ví dụ: GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 22 Bài giảng môn học: Lập trình mạng Tiêu đề trang... lệnh new 3.10.4 with Lệnh này được sử dụng để thiết lập đối tượng ngầm định cho một nhóm các lệnh, bạn có thể sử dụng các thuộc tính mà không đề cập đến đối tượng Cú pháp with (object) { // statement } Ví dụ: GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 31 Bài giảng môn học: Lập trình mạng Ví dụ sau chỉ ra cách sử dụng lệnh with để thiết lập đối tượng ngầm định là document và có thể sử... Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 16 Bài giảng môn học: Lập trình mạng Website báo điện tử (http://vnexpress.net ) Website trường học Website bán hàng (cửa hàng, siêu thị ảo trên Internet) Website dịch vụ giải trí như ECards, Điện hoa, Các chủ đề khác 2.14.3 Thiết kế websitte theo các mẫu 1 Thiết kế website theo mẫu sau (http://greetings.yahoo.com) GV: Lê Anh Tú - Bộ môn Mạng & Truyền... Hiển thị một trang web Nghe (play) 1 file âm thanh, video với trình media trên web Ví dụ 1: GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 11 Bài giảng môn học: Lập trình mạng - - Ví dụ 2: . TRƯỜNG KHOA……………… WX Giáo trình Lập trình mạng Bài giảng môn học: Lập trình mạng GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT -. môn học: Lập trình mạng GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 10 Ví dụ: Kết quả: 9 Cú pháp thẻ <Select> Bài giảng môn học: Lập trình mạng GV:. Recordset 108 Bài giảng môn học: Lập trình mạng GV: Lê Anh Tú - Bộ môn Mạng & Truyền thông - Khoa CNTT - ĐHTN 4 Chương 1- Mở đầu Yêu cầu: Giáo viên cần trình bày và trao đổi với sinh viên