›
›

Giáo trình Thiết kế và lập trình Web

pdf 123 trang Gia Huy 17/05/2022 3291
Download
Bạn đang xem 20 trang mẫu của tài liệu "Giáo trình Thiết kế và lập trình Web", để 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:

  • pdfgiao_trinh_thiet_ke_va_lap_trinh_web.pdf

Nội dung text: Giáo trình Thiết kế và lập trình Web

  1. Lời nói đầu Ngày nay với sự phát triển mạnh của ng ành Công Nghệ Thông Tin, Internet và Web trở nên không thể thiếu trong cuộc sống. Vì thế, xây dựng các ứng dụng Web l à cần thiết. Giáo trình Thiết kế và lập trình Web hướng dẫn cách xây dựng một ứng dụng Web từ cơ bản đến nâng cao bằng công nghệ HTML và ASP. Được biên soạn với phương châm đảm bảo tính khoa học, thiết thực, dễ hiểu nhằm giúp sinh vi ên ngành công nghệ thông tin có được tài liệu hữu ích cho việc học tập. Tuy có nhiều cố gắng trong công tác biên soạn, nhưng do lần đầu xuất bản nên chắc chắn sẽ có nhiều khiếm khuyết. Chúng tôi rất mong nhận đ ược các ý kiến đóng góp để hoàn thiện hơn trong các lần tái bản kế tiếp. Nhóm biên soạn
  2. Chương 1: Các khái niệm cơ bản 1. Mạng máy tính là gì? Mạng máy tính là một tập các máy tính được nối với nhau bởi đường truyền theo một cấu trúc nào đó và qua đó các máy tính có th ể trao đổi tin tức thông qua các giao thức truyền thông. Đường truyền là một hệ thống các thiết bị truyền dẫn có dây hay không có dây như cáp xoắn, cáp đồng trục , cáp quang, dây điện thoại, sóng vô tuyến Tập các đường truyền tạo nên một cấu trúc mạng. Mạng máy tính được phân thành 2 loại: mạng diện rộng và mạng cục bộ, việc phân loại mạng máy tính dựa vào khoảng cách địa lý. Mạng cục bộ (Local Area NetWorks) hay th ường gọi là mạng LAN: là mạng được thiết kế để trao đổi thông tin giữa các máy tính trong một toà nhà, một khu nhà, một phân xưởng nhỏ. Mạng diện rộng (Wide Area NetWorks) hay c òn gọi là mạng WAN: Là mạng được thiết lập để kết nối các máy tính ở những khu vực lại với nhau, ví dụ như giữa các thành phố, giữa các khu vực 2. Internet là gì? Internet ra đời vào giữa năm 1960. Người ta đã xây dựng Internet như một giao thức để trao đổi và chia sẻ thông tin giữa các viện nghiên cứu với nhau. Ngày nay Internet cho phép hằng trăm triệu người trên khắp thế giới liên lạc và trao đổi thông tin với nhau thông qua tập các tập các giao thức gọi chung l à TCP/IP (Transmission Control Protocol/Internet Protocol). 3. Địa chỉ IP là gì ? IP là một địa chỉ dùng để xác định đối tượng gởi và nhận thông tin trên Internet, địa chỉ này có kích thước 32 bits (version 4), 64 bits (version 5 trở l ên). Khi gửi một nội dung, thì địa chỉ IP của bạn sẽ được gửi cùng các gói tin nội dung đến người nhận. Khi người nhận nhận được yêu cầu từ bạn thì họ căn cứ vào địa chỉ IP để phản hồi thông tin lại cho bạn. Địa chỉ IP gồm 2 phần: Phần địa chỉ mạng v à phần địa chỉ máy. 32bits địa chỉ IP được chia thành 4 vùng, mỗi vùng có kích thước 1 byte (8 bits) được biểu diễn dưới dạng thập phân, thập lục phân hay nhị phân. Thông th ường người ta dùng cách viết thập có dấu chấm để tách các vùng. Mục đích của địa chỉ IP là để định danh duy nhất cho một máy tính bất kỳ trên liên mạng. Các máy tính trao đổi thông tin với nhau thông qua mô hình Client/Server. Mô hình Client/Server là mô hình trao đổi thông tin giữa các máy tính trong đó Server thường là máy cung cấp thông tin trong khi Client l à một công cụ hay chương trình trên máy tính khác dùng để lấy thông tin từ máy Server. Tuy nhiên, máy Client cũng có thể đóng vai trò cung cấp dữ liệu cho máy Server. Để trao đổi thông tin giữa các máy tính với nhau ng ười ta đặt ra một số giao thức (protocol) truyền thông trên mạng, các quy định về việc trao đổi thông tin để các máy tính có thể nói chuyện với nhau thông qua mạng. Với mức độ phổ biến của Internet ng ày càng cao, số lượng người tham gia ngày càng lớn thì các giao thức truyền thông trở nên phổ biến và đa dạng. Sau đây là một số 1
  3. giao thức thường gặp, cho phép người sử dụng Internet gửi/nhận th ư điện tử (E-mail), tập tin (File), đọc tin và đưa tin. 4. Giao thức SMTP, POP3 (Simple Mail Transfer protocol) Là giao thức dùng để gửi/nhận thư điện tử (E-mail) từ người dùng (user) này đến người dùng (user) khác được gửi từ user này đến user khác thông qua protocol này. Thông thường người ta dùng một e-mail client đê gửi thông điệp (message), còn mail server trên internet quản lý, trả lời e-mail phúc đáp. E-mail (electronic mail) là dịch vụ trao đổi thư điện tử trên mạng viễn thông. Nội dung thư điện tử thường được mã hóa dưới dạng mã ASCII khi gửi, tuy nhiên thư điện tử còn hỗ trợ việc trao đổi thông tin hình ảnh và âm thanh. Để trao đổi thông tin bằng E-mail bạn cần tạo một hộp mail cho chính bạn. Một hộp mail có 3 thành phần chính sau: Địa chỉ hộp mail: Là định danh của hộp mail giúp xác định ng ười gửi và người nhận. Chúng ta gửi E-mail thông qua địa chỉ này, địa chỉ mail thường có dạng tên@tênmiền, ví dụ: xuântt@yahoo.com, xuantt đóng vai trò là tên, yahoo.com là tên miền. Địa chỉ mail được quản lý bởi mail server thông qua các dịch vụ cung cấp mail như FPT, SaigonNet, vnEpress, Yahoo, Hotmail, vnn tuy nhiên hi ện nay có rất nhiều dịch vụ cung cấp mail miễn phí. Nh ưng thông dụng nhất vẫn là 2 dịch vụ cung cấp mail Yahoo và Hotmail. Một hộp mail có một tên đăng nhập và một mật khẩu để truy cập hộp mail của mình. Tên đăng nhập và mật khẩu được tạo khi chúng ta đăng ký hộp mail. Điều này bảo đảm tính bảo mật của hộp mail của bạn v à chỉ có bạn mới biết mật khẩu cùng tên đăng nhập của bạn để vào hộp mail mà thôi. 5. Giao thức FPT (File Transfer Protocol) Đây là một giao thức để trao đổi các tập tin tr ên Internet với nhau. Nguyên tắc hoạt động của nó khá đơn giản. FTP dùng để tải các tập tin (file) từ máy tính n ày sang máy tính khác, các tập tin (file) này có thể là các tập tin chứa văn bản, âm thanh, h ình ảnh. Các máy gửi yêu cầu tập tin qua lại thông qua nhiều ch ương trình khác nhau. Tuy nhiên, chúng ta có thể dùng một tập hợp lệnh như “open” (để kết nối với máy server) và “get” (để tải các tập tin này về máy client) hoặc có thể chọn tập tin mong muốn từ một giao diện của chương trình có sẵn để trao đổi các tập tin giữa các máy với nhau.FTP cũng có thể dùng để tải các chương trình, tập tin giữa các máy server với nhau. 6. Giao thức HTTP (HyperText Transfer Protocol) Là giao thức dùng để hiển thị trang web dưới dạng văn bản, hình ảnh, âm thanh, video, và các liên kết (links) đến các trang web khác tr ên World Wide Web. Khi chúng ta chọn các liên kết thì HTTP sẽ mở một nội dung mới thông qua trình duyệt Web cho chúng ta. Đây là giao thức nền tảng trong tập các giao thức ICP/IP. 7. Giao thức NNTP (Network News Transfer Protocol) Là giao thức phân phối thông điệp một cách rộng r ãi với nhiều chủ đề khác nhau. Thông qua một chương trình tin tức Client như Collabra của Netscape hay chương trình Internet News của Microsoft bạn có thể đọc hay đ ưa các bài báo cáo trong những nhóm mới. 8. Giao thức Chat 2
  4. Là giao thức cho phép người dùng trao đổi thông tin trực tiếp dưới dạng văn bản, hình ảnh và âm thanh. Các chương trình Chat thông dụng nhất hiện nay là YahooMessenger, ICQ, MIRC 9. URL URL (Uniform Resource Locator) là đ ịa chỉ của một trang Web hay bất kỳ một tập tin (file) nào khác trên Internet. Mỗi URL trên Web là duy nhất. URL có một cú pháp đặc biệt. Tất cả các URL phải chính xác, thậm chí có một ký tự sai hay thiếu một dấu chấm cũng không đ ược chấp nhận. Một ký tự sai trong URL có thể mang đến cho bạn một trang Web ho àn toàn khác biệt hoặc kết quả được trả về là một thông báo lỗi. Một URL đơn giản dùng cho Web bao gồm tên của Web protocol, theo sau bởi dấu hai chấm (:) và hai dấu (//), tiếp đến là tên của domain và kết thúc bởi dấu (/). Ví dụ: Cấu trúc của một URL có thể bao gồm các phần sau: Phần thứ nhất của URL là tên giao thức. Cho đến nay tất cả các URL đều bắt đầu là http:// (Hypertext Transfer Protocol) b ởi vì đó là trang Web và HTML. Nhưng URL có th ể chỉ đến các phần khác của Internet chứ không phải chỉ là Web. Sau đây là một số giao thức được dùng trong URL: ftp:// tên giao thức (File Transfer Protocol) http:// tên giao thức (Hypertext Transfer Protocol) mailto: địa chỉ thư điện tử (Electronic mail address) không y êu cầu hai ký tự ‘/’. news: Giao thức cho phép mọi người tham gia vào nhóm tin nếu trang chủ của bạn có liên quan đặc biệt đến nhóm. Hoặc cho phép nhận các câu hỏi cần trả lời từ một nhóm tin n ào đó. Như vậy bạn có thể hạn chế được số lượng e-mail nhận được (không yêu cầu hai ký tự ‘/’). telnet: Giao thức cho phép trao đổi thông tin trực tiếp giữa các máy tính với nhau bằng cách yêu cầu người sử dụng nhập tên truy cập và mật khẩu (không yêu cầu hai ký tự ‘/’). file:// Tài liệu mà bạn đang truy xuất được đặt trên máy tính của bạn thay vì trên Web. Phần thứ hai của URL là tên của domain. Domain đại diện cho tên của server mà bạn đang kết nối. Phần thứ ba của URL là đường dẫn đến tập tin cần truy cập, th ường bắt đầu bằng tên tài khoản (account name). Nếu bạn muốn truy xuất đến trang Web được tạo bởi một người dùng (user) xác định thì phải thêm tên của tài khoản vào URL. Tên của tài khoản luôn bắt đầu bằng ký tự (~). Ví dụ: Phần thứ tư của URL là tên đường dẫn và tên tập tin (pathname và filename). URL thường chỉ ra tên đường dẫn và tên tập tin cụ thể. 3
  5. Đây là một miền xác định trên máy chủ đang chứa tập tin cần truy xuất. Phần thứ năm của URL là tên của anchor (anchor name). Đây l à một con trỏ chỉ đến một phần xác định của một file HTML. Nó luôn bắt đầu bằng ký tự (#). Anchor đặc biệt rất hữu dụng đối với các t ài liệu lớn. Tuy nhiên tên account, tên đư ờng dẫn, tên file và tên anchor không ph ải là thành phần bắt buộc đối với một URT. Ví dụ một URL đầy đủ: Trong đó: http:// : Tên giao thức (Protocol) www.zdnet.com : Tên miền (domain) ~zdi :Tên tài khoản (account) software/win95 : Đường dẫn thư mục utils.html : Tên tập tin (file) #WINZIP : Tên neo (anchor) 10. Hyperlink là gì ? Hyperlinks (hay còn gọi là links) rất cần thiết đối với World Wide Web. D ùng hyperlinks để liên kết từ tài liệu này đến tài liệu khác là một hoạt động rất phổ biến trên web. Bạn có thể tạo links đối với bất kỳ đối t ượng nào trên web. Links có thể kết nối trực tiếp với văn bản, hình ảnh, âm thanh hay một file HTML khác. Hyperlink th ường được hiển thị với một màu sắc mặc định. Tuy nhiên chúng ta có thể thay đổi màu sắc nếu cần. Chỉ cần nhấn chuột vào hyperlinks, tài liệu được link sẽ được hiển thị. Thông thường, hình dạng con trỏ sẽ thay đổi thành hình bàn tay khi rê chuột qua vùng hyperlinks vì thế chúng ta sẽ biết được hyperlinks đang ở đâu để có thể nhắp chuột. Hyperlinks giúp chúng ta dễ dàng tìm kiếm các thông tin khác nhau về một chủ đề. Nếu bạn đang tìm kiếm một chủ đề nào đó, chỉ cần vào trang web có hyperlinks kết nối với vấn đề này, và chúng ta sẽ nhận được một danh sách liệt kê hàng trăm chủ thể có liên quan. 11. Web Browser là gì? Web browser là một công cụ hay chương trình cho phép bạn truy xuất và xem thông tin trên web. Có nhiều web browser để truy xuất web. Mỗi web browser có những đặc điểm khác nhau và chúng sẽ hiển thị những trang web không ho àn toàn giống nhau. Hai web browser đang phổ biến hiện nay l à Nestcape’s Navigator của công ty Netscape và Microsoft’s Internet Explorer của công ty Microsoft. Chúng hiển thị được cả hình ảnh, âm thanh và rất dễ sử dụng. Ngoài việc truy xuất web, Netcape và IE (Internet Explorer) còn cho phép chúng ta thực hiện một số công việc khác nhau như gửi và nhận thư điện tử (e-mail), tải các tập tin (download file) từ máy chủ (server), Với hai web browser này web đã trở thành một hệ thống thông tin đa phương tiện có mối liên hệ với nhau. 12. Web Server là gì? Web server đơn giản là một máy tính nối vào Internet và chạy các phần mềm được thiết kế để truyền tải nội dung d ưới dạng trang HTML (Trang HTML có thể chứa 4
  6. âm thanh, hình ảnh, video, văn bản) hay dưới dạng tập tin (tập tin có thể l à tập tin hình ảnh, âm thanh, văn bản, video ). Máy chủ (server) phải đủ mạnh để đáp ứng nhiều kết nối Internet đồng thời. Thông qua trình duyệt Web máy chủ sẽ cung cấp các dịch vụ đ ược yêu cầu đến máy client. Thông thường web server chạy trên các hệ điều hành khá mạnh như Unix, Linux, Microsoft Windows NT Server, Windows 2000 server. 13. Website là gì? Là tập các trang web liên quan đến một công ty, một tập đoàn, một trung tâm hay một cá nhân nào đó. Ví dụ: Website của Trung Tâm Phát Triển Công Nghệ Thông Tin Thành Phố Hồ Chí Minh gồm tập các trang web đ ược bắt đầu từ trang chủ có địa chỉ (URL) là www.citd.edu.vn. 14. World Wide Web (www) là gì? World Wide Web là dịch vụ thông dụng ra đời vào năm 1990. Dịch vụ World Wide Web sử dụng giao thức HTTP (HyperText Transfer Protocol). Để sử dụng dịch vụ này chúng ta cần một trình duyệt Web (gọi là Web Browser). Để truy cập một trang Web bạn cần phải biết địa chỉ (URL-Uniform Resource Locator) của trang web đó. Ví dụ nếu bạn muốn truy cập v ào trang chủ của Yahoo thì bạn đánh địa chỉ cho trình duyệt web. Khi đó trình duyệt web sẽ mở trang chủ Yahoo cho bạn. Từ trang chủ này bạn có thể đi đến các trang khác bằng cách nhấn chuột vào đối tượng HyperLink trong trang web. H ình dạng con chuột thay đổi (thông thường là hình bàn tay) khi đi qua các đối tượng Hyperlink này. Trang Web truyền tải nhiều thông tin khác n hau với nhiều hình thức khác nhau như văn bản, âm thanh, hình ảnh Sự ra đời của trang web giúp con ng ười trao đổi nhanh hơn, tiện lợi hơn, phong phú hơn và đa dạng về cả hình thức và nội dung. World Wide Web (cũng được gọi là ‘W3’, ‘WWW’ hay gọi tắt là Web) là một hệ thống rộng lớn bao gồm nhiều HTTP server (máy chủ sử dụng giao thức HTTP - Hypertext Transfer Protocol), chúng đang th ực hiện việc trao đổi file thông qua Internet. 15. Sự khác biệt giữa Inernet và World Wide Web? Nhiều người nghĩ rằng Web và Internet là một. Nhưng Web chỉ là một phần của Inerner và nó đang phát triển với tốc độ nhanh hơn các phần khác. Trên Interner chúng ta có thể gửi và nhận nhiều loại thông tin khác nhau nh ư thư điện tử (e-mail), các bài báo, tán gẫu và các trang Web. Như vậy Web chỉ là một trong những dịch vụ của Internet. 16. Web page là gì? Web page là trang web, là một loại tập tin đặc biệt được viết bằng ngôn ngữ siêu văn bản HTML. Web page có thể hiển thị các thông tin văn bản, âm thanh, h ình ảnh Trang Web này được đặt trên máy server sao cho máy client có th ể truy cập được nó. Chúng ta cũng có thể đặt tập tin n ày trên ổ cứng máy tính của mình nhưng người khác sẽ không đọc được nó. 5
  7. Chương 2 : lập trình web với ngôn ngữ siêu văn bản html 1. Khái niệm ngôn ngữ HTML HTML (Hypertext Markup Language) là ngôn ng ữ định dạng văn bản siêu liên kết, là ngôn ngữ lập trình Web căn bản, cho phép định dạng văn bản, bổ sung h ình ảnh, âm thanh và video, cũng như lưu tất cả vào một tập tin dưới dạng văn bản hay dưới dạng mã ASCII, binary mà bất cứ máy tính nào cũng có thể đọc được thông qua trình duyệt Web (Web browser). HTML có hai đặc tính c ơ bản sau: • Siêu văn bản: Tạo các liên kết trong trang Web, cho phép truy cập thông tin từ nhiều hướng khác nhau thông qua các H yperlinks. • Tính tổng quát: Hầu như máy tính nào cũng có thể đọc được thiết kế bằng ngôn ngữ HTML. Điều đó l à do dữ liệu trong tập tin HTML được lưu dưới dạng văn bản hay dưới dạng mã ASCII. 2. lập trình web với ngôn ngữ HTml 2.1 Các thành phần cơ bản của HTML Tag là gì? Tag là một tập các ký hiệu được định nghĩa trong HTML có ý nghĩa đặc biệt. Tag được bắt đầu bằng ký hiệu nhỏ hơn ( ). Nó quy định văn bản được hiển thị trên màn hình như thế nào. Ví dụ: + Tag định phông chữ cho văn bản là chữ đậm. + Tag định dạng phông chữ nghiêng. + Tag đặt tiêu đề cho trang web. + Tag bắt đầu một trang web. + Tag bắt đầu cho một đoạn văn bản. Mỗi tag trong HTMl có một ý nghĩa ri êng, nó khá rõ ràng và dễ hiểu. Tag không phân biệt chữ hoa chữ thường vì thế các tag , , và đều có nghĩa như nhau. Có hai loại tag: Tag bắt đầu và tag kết thúc. Dữ liệu bị tác động sẽ nằm giữa tag bắt đầu và tag kết thúc. Tag kết thúc giông tag bắt đầu nhưng có thêm dấu xuyệt phải (/) ở phía trước. Ví dụ: Lap trinh web voi HTML Trong đó: : Tag bắt đầu. Lap trinh web voi HTML: chuỗi dữ liệu bị tác động. : Tag kết thúc. Thuộc tính Có nhiều tag còn có thuộc tính kèm theo. Thuộc tính được nhập vào ngay trước dấu ngoặc đóng (>) của tag. Có thể sử dụng nhiều thuộc tính trong một tag. Thuộc tính này kế tiếp thuộc tính khác, phân cách nhau bởi khoảng trắng. Ví dụ: Trong đó: : Tên tag : Thuộc tính Giá trị 6
  8. Ngoài các thuộc tính không có giá trị còn có các thuộc tính của tag có giá trị nữa. Ví dụ: thuộc tính CLEAR của tag có ba giá trị chọn lựa : left, right, all. Ví dụ: Trong đó: : tên tag CLEAR: thuộc tính left: giá trị của thuộc tính CLEAR. Giá trị nên đặt giữa hai dấu nháy “”. Tuy nhi ên có thể bỏ dấu nháy trong các trường hợp giá trị chỉ chứa chữ (A - > Z, a - > z), số (0 - > 9), dấu nối (-), dấu chấm (.). Tag lồng nhau Thẻ lồng nhau dùng để chỉnh sửa cách trình bày nội dung trong một trang web. Ví dụ chúng ta muốn trình bày chữ nghiêng trong một vài chữ quan trọng trong tiêu đề. Không phải tag nào cũng chấp nhận dạng thẻ lồng nhau. Trật tư sắp xếp của những tag lồng nhau. Thẻ đ ược mở đầu tiên sẽ là thẻ được đóng sau cùng. Ví dụ: Dòng đầu tiên đúng, dòng thứ hai sai Đúng: Phần Nội Dung Sai: Phần Nội Dung Khoảng trắng Trình duyệt bỏ qua các khoảng trắng giữa các tag trong tập tin HTML. Tên tập tin Nên sử dụng chữ thường khi đặt tên tập tin, điều này giúp ích cho bạn lẫn người duyệt. Với bạn, sẽ giúp ích khi tạo li ên kết giữa các trang Web. Với người dùng, sẽ dễ dàng khi truy cập trang web. Đặt tên tập tin phải đúng phần mở rộng “.htm” hay “.html”. Gi úp trình duyệt Web định ra loại tài liệu khi duyệt. 2.2 Tạo trang Web Có thể tạo trang Web trên bất cứ chương trình xử lý văn bản nào như chương trình soạn thảo văn bản Nodepad, WordPad, Word ở đây chúng ta sẽ thực hiện tạo trang Web trên trình soạn thảo văn bản NotePad, chương trình soạn thảo có sẵn trên Windows, bằng cách vào menu Start -> Programs -> Accessories -> Notepad. 2.3. Cấu trúc của một tập tin HTML Một trang Web luôn bắt đầu bằng tag và được kết thúc bởi tag . Hầu hết các trang Web được chia thành 2 phần. Phần đầu và phần thân. Phần đầu là phần được đặt giữa 2 tag và tag . Phần thân là phần được đặt giữa hai tag và tag . Phần đầu là nơi định rõ tiêu đề, nội dung của tiêu đề được đặt giữa 2 tag và . Cú pháp: tên tiêu đề của trang Web Hầu hết các trình duyệt Web, tiêu đề xuất hiện trên thân tiêu đề của cửa sổ trình duyệt. Phần thân chứa nội dung của trang Web l à phần chính của trang Web, phần cung cấp thông tin cần thiết đến người duyệt Web. 7
  9. Cú pháp: Nội dung trang Web Ví dụ: Tạo một trang web đầu tiên, mở chương trình soạn thảo văn bản NodePad và gõ đoạn HTML như trong hình sau: 2.4. Xem trang HTML bằng trình duyệt Web Sau khi thiết kế trang Web xong bạn dùng một trình duyệt Web để xem kết quả thiết kế. Vì không biết người dùng sử dụng trình duyệt Web nào. Nên tốt nhất nên xem nó trong nhiều trình duyệt Web khác nhau theo các bước sau. Khởi động trình duyệt Web InternetExplorer -> Nhấp File -> Open -> Trong hộp thoại Open bạn gõ địa chỉ tập tin rồi nhấp OK như hình sau: Hoặc nhấp vào nút Browser để chọn tập tin trong hộp thoại vừa mở ra, nhấp tiếp nút Open trong hộp thoại để hiển thị trang Web lên cửa sổ trình duyệt. Khi ấy nội dung của trang Web trong ví dụ trên được hiển thị như sau: 2.5. Các tag cơ bản trong HTML 2.5.1. Tag chú giải Tag này được thêm vào tài liệu HTML nhằm nhắc nhở mục đích của các d òng lệnh. Trình duyệt không tính nội dung nằm giữa tag ghi chú n ày. Cú pháp: 2.5.2 Các tag định dạng văn bản Định phông chữ: Đặt tag FONT trước nội dung văn bản cần hiển thị. Cú pháp: Trong đó fontname1 là phông chữ được chọn, gõ tên đầy đủ của phông chữ cả chữ (đậm (Bold), nghiêng (Italic), gạch dưới (Underline)). Ta có thể bổ sung th êm phông chữ fontname2 phòng khi người duyệt không cài loại phông chữ fontname1, các phông chữ được viết cách nhau dấu phảy. Ví dụ: Ta thêm 3 thẻ lệnh sau vào ví dụ trên Như vậy đoạn lệnh được viết lại như sau: Mã HTML To chuc Giám đốc Phó giám đốc Nhân viên 8
  10. Kết quả hiển thị trên trình duyệt Giám đốc Phó giám đốc Nhân viên Định kích thước chữ Cú pháp: Với n mang giá trị từ 1 đến 7, giá trị mặc định l à 3. Tag BASEFONT dùng để định kích thước cho toàn bộ văn bản, nếu muốn thay đổi một đoạn hay một từ trong văn bản thì dùng tag FONT, tag BIG, tag SMALL. Định màu cho văn bản Cú pháp: Với color là màu dùng cho chữ, các giá trị màu có thể gõ bằng chữ hoặc gõ bằng chữ số ở hệ hexa (hệ 16). Nếu gõ ở hệ hexa thì thành phần color là sự kết hợp thứ tự giữa 3 giá trị m àu tương ứng là Red (đỏ), Green (xanh lục), Blue (xanh đậm), mỗi giá trị m àu được biểu diễn bởi 2 chữ số thập phân. Ví dụ: Ta muốn màu chữ là màu đỏ thì ta gõ “Red” hoặc “FF0000”, nếu màu vàng thì Yellow hoặc “FFFF00”, màu xanh đậm thì “Green” hoặc “0000FF” Như vậy tag FONT không những dùng để định dạng kích thước văn bản mà còn định dạng màu cho văn bản. Ví dụ: Ta muốn định màu xanh đậm cho đoạn nội dung “Lop chuyen vien” n ên ta bỏ chúng vào 2 tag và Mã HTML To chuc Dao tao tu xa qua mang Lop chuyen vien cong nghe thong tin Kết quả hiển thị trên trình duyệt Dao tao tu xa qua mang Lop chuyen vien cong nghe thong tin Định dạng chữ Cú pháp: nội dung hoặc nội dung nội dung hoặc Ta định dạng chữ đậm chữ nghiêng cho văn bản bằng cách sử dụng 2 tag: Định dạng chữ đậm dùng tag hoặc tag Định dạng chữ nghiêng dùng tag hoặc tag 9
  11. Ví dụ: Từ ví dụ trên muốn phần nội dung “lop chuyen vien” đ ược in đậm còn phần nội dung “cong nghe thong tin” đư ợc in nghiêng thì 2 nội dung trên được bỏ vào 2 tag như sau: Lop chuyen vien cong nghe thong tin Ghi chú: Ta có thể kết hợp các thuộc tính vào chung một tag Ví dụ: Ta kết hợp cùng lúc 3 thuộc tính định dạng phông chữ là FACE (kiểu chữ hiển thị), SIZE (kích thước văn bản), COLOR (màu của văn bản) vào tag như đoạn tag sau: nội dung văn bản Ví dụ: Xét ví dụ sau Mã HTML Thong tin Lop chuyen vien chào các bạn đến với chương trình đào tạo chuyên viên Kết quả hiển thị trên màn hình Lop chuyen vien chào các bạn đến với chương trình đào tạo chuyên viên Sử dụng tag và tag để thay đổi từng phần hoặc cá thể trong nội dung văn bản. tag BIG dùng để thay đổi phần nội dung thành chữ lớn, tag SMALL dùng để thay đổi phần nội dung thành chữ thường. Cú pháp: và Định dạng chỉ số trên, chỉ số dưới Chữ (hoặc số) nằm hơi cao hoặc hơi thấp hơn so với phần văn bản chính được gọi là chỉ số trên và chỉ số dưới. Để định dạng chỉ số trên hay chỉ số dưới ta dùng hai tag SUP (định dạng chỉ số trên), SUB (định dạng chỉ số dưới). Cú pháp: Chỉ số trên: Chỉ số dưới: Ví dụ: Ta muốn hiển thị phương trình bậc hai 2 AX +BX+C=0, C+O2 =CO2 lên Web thì ta dùng đoạn lệnh sau: Mã HTML dinh dang chi so AX 2 =BX+C=0 10
  12. C+O 2 =CO 2 Kết quả hiển thi trên trình duyệt AX2 +BX+C=O C+O2 =CO2 Trong đoạn lệnh trên ta sử dụng tag , tag này dùng để sang dòng mới mà ta sẽ đề cập cụ thể trong các phần kế tiếp. Phân đoạn Dùng tag để phân đoạn văn bản. Muốn canh chỉnh đoạn tr ên trang Web ta sử dụng thêm thuộc tính ALIGN. Cú pháp: Với direction mang 1 trong 3 giá trị sau: - Left (nội dung trong đoạn được canh trái) - Right (nội dung trong đoạn được canh phải) - Center (nội dung trong đoạn được canh giữa) 2 Ví dụ: Muốn phân hai dòng AX +BX+C=0 và C+O2=CO2 thành hai đoạn riêng biệt, nội dung đoạn thứ nhất nằm ở giữa màn hình, đoạn thứ hai nằm bên trái màn hình thì ta viết lại đoạn lệnh như sau: dinh dang chi so AX 2 =BX+C=0 C+O 2 =CO 2 Tag phân cấp đề mục Đề mục trong trang Web giúp cho ng ười duyệt hiểu rõ hơn cấu trúc của trang. Cú pháp: với n mang giá trị từ 1->6 Trong HTML cho phép sử dụng 6 cấp đề mục trong trang Web, tuy nhi ên trong thực tế ta chỉ sử dụng 3 đến 4 cấp đề mục l à đủ. Ví dụ: ta xem xét đoạn lệnh sau: Mã HTML To chuc Giam doc Pho giam doc Nhan vien 11
  13. Kết quả hiển thị trên trình duyệt Giam doc Pho giam doc Nhan vien 2.5.3. Các tag định dạng hình ảnh Có nhiều loại hình ảnh trên một trang Web: Logo (biểu tượng), ảnh chụp, ảnh vẽ từ các chương trình xử lý ảnh như: CorelDraw, Paint, Photoshop Hình ảnh được đưa vào trang Web dưới dạng tập tin hình ảnh. Nhớ lưu hình ảnh dưới dạng tập tin có phần mở rộng “ gif”, “jpg” hoặc “pmg”. Hạn chế lưu ảnh dưới dạng tập tin có phần mở rộng “ bmp” như thế, chỉ có người dùng trình duyệt Web Internet Explorer mới xem đ ược hình ảnh này, mặt khác kích thước của các tập tin hình lưu dưới dạng “bmp” lớn hơn nhiều lần so với tập tin lưu dưới dạng “jpg”, “gif”, “pmg”. Chèn hình ảnh vào trang Web Để chèn hình ảnh vào trang Web ta dùng tag . Cú pháp: Tên tập tin chứa hình ảnh có cả đường dẫn thư mục, nếu tập tin hình ảnh được đặt cùng thư mục với thư mục chứa trang Web thì không cần đường dẫn thư mục. Tạo thư mục có tên images trong thư mục chứa trang Web, sau đó lưu tập tin hình ảnh vào thư mục images. Khi đó SRC=”images/tên tập tin” Thêm đường viền chung quanh vào hình ảnh Để thêm đường viền vào xung quanh hình ảnh ta dùng thêm thuộc tính BORDER vào tag Cú pháp; Với n là độ dày mảnh của đường biên ảnh, tính bằng pixel. Canh chỉnh hình ảnh Để canh chỉnh hình ảnh ta dùng thuộc tính ALIGN trong tag với 3 giá trị: left, center và right. Cú pháp: nội dung Trong đó direction mang 1 trong 3 giá trị sau: - ALIGN = left : Hình ảnh nằm bên trái màn hình. - ALIGN = center : Hình ảnh nằm giữa màn hình. - ALIGN = right : Hình ảnh nằm bên phải màn hình. Thêm chữ xung quanh hình ảnh Muốn thêm chữ xung quanh hình ảnh ta thêm thuộc tính ALIGN vào tag . Cú pháp: nội dung muốn chèn Trong đó direction mang 1 trong 3 giá trị sau: - ALIGN = top : Vị trí văn bản nằm ở phía trên màn hình. - ALIGN = middle : Vị trí văn bản nằm ở giữa hình ảnh. - ALIGN = bottom : Vị trí văn bản nằm ở phía bên dưới hình ảnh. Ví dụ: Mã HTML 12
  14. hien thi hinh anh hien thi hinh anh qua 3 cach tren van ban o phia tren. giua van ban o giua. giua van ban o phia duoi. Kết quả hiển thị trên trình duyệt 2.5.4. Các tag định dạng trang Đường kẻ ngang trang Web Dùng tag để kẻ đường ngang trên trang Web, giúp trang Web rõ ràng hơn. Cú pháp : Trong đó: • SIZE: Độ dầy/mỏng của đường kẻ tính bằng Pixel. • WIDTH: Chiều rộng của đường kẻ tính bằng Pixel. • ALIGN: Thuộc tính này có ba giá trị left, right, center dùng để chỉnh vị trí đường ngang. Định màu nền cho trang Web Để định màu nền cho trang Web ta thêm thuộc tính BGCOLOR trong tag BODY. Cú pháp: color là màu cần định cho trang Web Ví dụ: Ta muốn tạo màu nền của trang là màu vàng (yellow) cho Web thì ta dùng đoạn lệnh sau: mau nen Định ảnh nền cho trang Web Dùng hình ảnh làm nền cho toàn trang Web thay vì chúng ta s ử dụng màu nền. ảnh nền giúp trang Web của chúng ta đẹp h ơn, hấp dẫn hơn, trang Web có sức lôi cuốn người dùng hơn. 13
  15. Để định hình ảnh nên cho trang Web ta sử dụng thuộc tính BACKGROUND trong tag BODY thay vì dùng thuộc tính BGCOLOR để định màu nền. Cú pháp : Tên file là tên tập tin hình ảnh cần làm nền cho trang Web. Ví dụ: Muốn định tập tin ảnh có tên “b.jpg” trong thư mục images làm nền cho trang Web ta dùng đoạn lệnh sau: mau nen Xuống dòng trong trang Web Khi dùng tag để phân đoạn thì khoảng cách giữa các đoạn khá lớn. Để tránh khuyết điểm này ta dùng tag để xuống dòng. 2.5.5. Các tag tạo danh sách (list) Tạo danh sách theo thứ tự Sử dụng tag để tạo danh sách theo thứ tự Cú pháp: nội dung mục 1 nội dung mục 2 nội dung mục n Trong đó X định kiểu ký hiệu sẽ được sử dụng trong danh sách. A là chữ hoa a là danh sách được đánh theo thứ tự chữ thường a,b,c z I danh sách được đánh theo thứ tự số La Mã I, II, III i danh sách được đánh theo thứ tự số La Mã i, ii, iii 1 danh sách được đánh dấu theo thứ tự 1,2,3 Ngoài ra còn có thuộc tính START=n, n là giá trị bắt đầu của danh sách. Ví dụ: Xét đoạn lệnh sau: Mã HTML mau nen cong cha nhu nui thai son nghia me nhu nuoc trong nguon chay ra mot long tho me kinh cha cho tron chu hieu moi la dao con Kết quả hiển thị trên trình duyệt 2. cong cha nhu nui thai son 14
  16. 3. nghia me nhu nuoc trong nguon chay ra 4. mot long tho me kinh cha 5. cho tron chu hieu moi la dao con Tạo chấm tròn (Bullet) cho danh sách Dùng tag để tạo chấm tròn cho danh sách. Cú pháp: nội dung mục thứ 1 nội dung mục thứ 2 nội dung mục thứ n “kiểu chấm tròn” mang một trong 3 giá trị sau: disc: kiểu dấu chấm tròn đậm (mặc định đối với danh sách ở cấp thứ nhất). circle: kiểu dấu chấm tròn rỗng (mặc định đối với danh sách ở cấp 2). square: kiểu dấu chấm vuông đặc (mặc định đối với danh sách từ cấp thứ 3 trở đi) Ví dụ: Đoạn lệnh sau tạo dấu chấm tròn cho danh sách . Mã HTML mau nen Dau cham tron cho danh sach muc mot muc hai muc ba muc nam muc sau Kết quả hiển thị trên màn hình Dau cham tron cho danh sach muc mot muc hai muc ba muc nam muc sau Với cách tạo Bullet này trông có vẻ đơn điệu,xấu xí. Bạn hãy tự vẽ những hình nghộ nghĩnh , sau đó dùng những hình ảnh này để tạo Bullet bằng tag . Ví dụ: Ta vẽ một Bullet và lưu tập tin hình ảnh này với phần mở rộng là “gif’. Khi ấy ta tạo danh sách bằng đoạn lệnh sau: Mã HTML 15
  17. Bullet tu tao Cac huong trong nganh CNTT Cong nghe phan mem Cong nghe tri thuc He thong thong tin Mang may tinh Kết quả hiển thị trên trình duyệt Cac huong trong nganh CNTT Cong nghe phan mem Cong nghe tri thuc He thong thong tin Mang may tinh Tạo danh sách định nghĩa Là loại danh sách có dạng một từ hay một cụm từ k èm theo nội dung dài, rất thích hợp giải thích ý nghĩa của nội dung. Để làm được điều này ta dùng các tag , , . Tag : Để tạo danh sách định nghĩa Tag : Để đánh dấu thuật ngữ được định nghĩa trong danh sách. : Giải thích thuật ngữ ở trên Ví dụ: Ta xét đoạn lệnh sau: Mã HTML Danh sach dinh nghia Cac huong trong nganh cong nghe thong tin Huong cong nghe phan mem Dao tao ra nhung lap trinh vien, dap ung nhu cau can thiet cua xa hoi, sau khi ra truong Sinh Vien duoc gioi thieu viec lam o cac khu cong nghiep phan mem Kết quả hiển thị trên trình duyệt Cac huong trong nganh cong nghe thong tin Huong cong nghe phan mem Dao tao ra nhung lap trinh vien, dap ung nhu cau can thiet cua xa hoi, sau khi ra truong Sinh Vien duoc gioi thieu viec lam o cac khu cong nghiep phan mem 16
  18. 2.5.6. Tạo liên kết (link) Liên kết là đặc trưng của Word Wide Web, chúng cho phép ng ười dùng chuyển từ mục này sang mục khác trong cùng trang Web hoặc chuyển từ trang Web này đến trang Web khác. Liên kết trong cùng trang Web Cho phép liên đến các mục bên trong một trang Web. Để làm được điều này trước tiên phải tạo điểm neo (Bookmark) và sau đó tạo liên kết đến điểm neo này. Cú pháp: Tạo điểm neo: Tạo liên kết: Dấu “#” báo cho trình duyệt biết liên kết là nội bộ bên trong trang Web. Ví dụ: Xét đoạn lệnh sau: Hyperlink Bai 1: Mot so khai niem lien quan den mang may tinh Bai 2; Lap trinh voi ngon ngu sieu lien ket HTML Tạo liên kết đến các trang Web khác Cú pháp: Ví dụ:  : liên kết đến trang chủ Yahoo.  : liên kết đến trang có tên home.htm trong cùng thư mục.  : gọi Open của JavaSript.  : mở cửa sổ tải tập tin nén “code.zip”.  : thực hiện việc gửi mail.  : mở trang Web có tên “news.htm” trong cửa sổ được định nghĩa bởi thuộc tính TARGET, trong đó TARGET mang một trong những giá trị sau: . name: Nạp trang news.htm lên cửa sổ hoặc Frame có tên Name. . _blank: Nạp trang news.htm vào một cửa sổ trống mới, cửa sổ mới n ày không có tên. . _parent: Nạp trang news.htm vào cửa sổ cha gần nhất của trang Web hiện hành. . _self: Nạp trang news.htm vào cùng cửa sổ với trang Web hiện hành. 17
  19. . _top: Nạp trang news.htm vào cửa sổ cao nhất. 2.5.7. Một số ký tự đặc biệt trong HTML Vì HTML dùng các ký tự ‘ ’ để đánh dấu các tag, do đó để thể hiện các ký tự đặc biệt này ta phải dùng các nhóm ký tự thay thế. Ký tự cần hiển thị Nhóm ký tự thay thế > & & “ " Khoảng trắng   2.5.8. Các tag dùng thiết kế bảng Để thiết kế một bảng biểu dùng các tag cơ bản sau, với các thuộc tính đi k èm như sau: :Bắt đầu một bảng mới với các thuộc tính đi k èm sau: . BGCOLOR: Định màu nền cho bảng . BORDER: Định độ dày/mảnh của đường viền. . BORDERCOLOR: Định màu cho đường viền. . BORDERCOLORDARK: Định màu sậm cho phần hắt bóng của đường viền. . BORDERCOLORLIGHT: Định màu nhạt cho phần sáng hơn của đường viền. . CELLPADDING: Định khoảng cách giữa nội dung và đường viền. . CELLSPACING: Khoảng cách giữa các ô. . FRAME: Hiển thị đường viền ngoài. . HEIGHT: Định chiều cao bảng. . WIDTH: Định chiều rộng bảng. . RULES: Hiển thị đường viền trong. : Bắt đầu một hàng mới trong bảng với các thuộc tính sau: . ALIGN/VALIGN: Canh chỉnh nội dung hàng theo phương ngang/dọc . BGCOLOR: thay đổi màu nền của bảng. , : Bắt đầu một đề mục mới cho bảng với các thuộc tính sau: . ALIGN/VLIGN: Canh chỉnh nội dung ô theo phương ngang/dọc. . BGCOLOR: thay đổi màu nền của ô. . COLSPAN: mở rộng ô qua nhiều cột. . ROWSPAN: kéo dài ô xuống nhiều hàng. . NOWRAP: Giữ nội dung ô nằm trên một dòng. . WIDTH, HEIGHT: định chiều rộng, cao cho ô. Tạo bảng Ví dụ: Tạo một bảng đơn giản bằng đoạn HTML sau: Mã HTML 18
  20. tao bang TEN DIEM TB LOAI Nguyen Thi An 7 KHA Nguyen Van Tuan 8 Gioi kết quả hiển thị trên màn hình TEN DIEM TB LOAI Nguyen Thi An 7 KHA Nguyen Van Tuan 8 GIOI . Dùng tag và đ ể mở rộng một ô qua nhiều dòng, nhiều cột. Ví dụ: Xét đoạn HTML sau: Mã HTML BANG DIEM HOC KY I DIEM TB NGUYEN THI AN 7 KHA NGUYEN VAN TUAN 8 GIOI Kết quả hiển thị trên trình duyệt DIEM TRUNG BINH HOC KY I NGUYEN THI AN 7 KHA NGUYEN VAN TUAN 8 GIOI 19
  21. Tạo khung viền cho bảng Cú pháp; Với “n” là độ dày của đường viền (tính bằng Pixel), nếu n=0 th ì bảng không có đường viền. Thay đổi màu khung viền Cú pháp: Ví dụ: Ta muốn độ dày viền=2 và màu khung viền là đỏ thì Tạo màu nền bảng Cú pháp: Màu nền cho các ô Cú pháp: hoặc Định kích thước bảng Cú pháp: Với “x”,”y” thứ tự là chiều rộng và chiều cao của bảng. Định kích thước cho ô Cú pháp: hoặc Canh bảng ở giữa trang Cú pháp: Với “direction” mang 3 giá trị “center”, “left”, “right” tương ứng với bảng nằm giữa, trái, phải trên màn hình. 2.5.9. Các tag dùng tạo Form Form là thành phần giao tiếp cơ bản giữa người duyệt Web với người tạo Web. Dữ liệu được nhập vào Form thông qua các hộp điều khiển (control) như Textbox, Checkbox, Radio button, push button, dropdown listbox Cú pháp; Tạo TextBox (hộp nhập liệu) TextBox dùng để chứa một dòng văn bản tuỳ ý do người dùng nhập vào. Để tạo một Texbox ta chỉ định thuộc tính TYPE=”text” theo cú pháp sau Cú pháp: Trong đó “name” là chuỗi ký tự nhận diện dữ liệu nhập v ào, “value” là dữ liệu đầu tiên hiển thị trong Textbox và được gửi đến máy chủ khi người duyệt không gõ thông tin gì khác, SIZE định kích thước của TextBox, MAXLENGTH giới hạn số ký tự nhập vào Textbox. Khi muốn chỉ định dữ liệu nhập vào Textbox dưới dạng mật khẩu(Các ký tự nhập vào không được hiển thị mà thay vào đó là các dấu ) ta thay thuộc tính TYPE =”password.” Ví dụ: Tạo một Textbox bằng đoạn HTML sau: Mã HTML 20
  22. Tạo TextBox Ten KH: Mat ma: Kết quả hiển thị trên trình duyệt Tạo Texbox với vùng văn bản chứa nhiều dòng Cú pháp: Trong đó “name” là chuỗi ký tự nhận diện dữ liệu nhập v à, “n” là chiều cao của vùng văn bản tính bằng dòng (mặc định n=4), “m” là chiều rộng của vùng văn bản tính bằng ký tự (giá trị mặc định m=40). Dùng thuộc tính WRAP để xuống dòng khi đụng lề. Tạo nút Radio button (nút chọn Radio) Radio là loại nút chỉ được chọn một trong số đó, không thể chọn lựa hai nút c ùng lúc. Để tạo một nút chọn Radio ta chỉ định thuộc tính TYPE=”radio” như cú pháp sau: Cú pháp: Trong đó “name” vừa nhận diện dữ liệu vừa liên kết các nút Radio trong một nhóm lại với nhau, các nút Radio trong cùng một nhóm thì có thuộc tính NAME giống nhau, đảm bảo một thời điểm chỉ có một nút đ ược chọn. “Data” là văn bản gửi đến máy chủ khi một nút Radio được chọn. CHECKED nút đó được chọn. Tạo ô chọn (checkbox) Khác với nút Radio, Checkbox cho người chọn nhiều nút trong cùng một nhóm. Giống như nút Radio, Checkbox liên kết với nhau thông qua thuộc tính NAME. Ta chỉ định thuộc tính TYPE=”checkbox” khi tạo nút chọn Checkbox Cú pháp: Trong đó chức năng của các thuộc tính giống nh ư chức năng của nút chọn Radio. Ví dụ: Mã HTML Tạo TextBox Trinh do: Dai hoc Cao dang 21
  23. Trung cap 18 -22 23 -30 30 -40 Kết quả hiển thị trên trình duyệt Web Tạo nút Push Button (nút nhấn) Để tạo nút nhấn ta chỉ định thuộc tính TYPE=”button” Cú pháp: Để tạo nút nhấn mà khi người dùng nhấn vào, dữ liệu của các điều khiển khác đều được đặt về giá trị mặc định lúc khởi tạo, ta chỉ định thuộc tính TYPE=”reset” trong tag . Tạo nút nhấn để kết thúc việc nhập liệu của một Form, ta chỉ định thuộc tính TYPE=”submit” trong tag . Ví dụ: Mã HTML Tạo TextBox Lop chuyen vien cong nghe thong tin    Kết quả hiển thị trên màn hình trình duyệt Web Tạo Dropdown Listbox (danh sách) Dropdown Listbox là danh sách chứa nhiều mục. Để tạo danh sách trên ta dùng tag , mỗi mục của Dropdown Listbox sẽ được định nghĩa bằng tag . Để đặt một mục chọn trong Dropdown Listbox là mặc định ta thêm vào thuộc tính SELECTED trong tag Ví dụ: Mã HTML Tạo list 22
  24. Mau vang Mau do Mau xanh Kết quả hiển thị trên trình duyệt Web Để tạo một ListBox cho phép hiển thị, chọn nhiều mục ta d ùng thêm thuộc tính MULTIPLE với SIZE=”n”, n là số mục Khi đó kết quả trên trình duyệt là: 2.6. Các tag tạo Frame (khung) Frame là thành phần cơ bản của trang Web, một trang Web có thể đ ược chia thành nhiều frame, mỗi frame sẽ chứa một trang Web riêng. 2.6.1. Tạo Frame có dạng hàng Để chia một trang Web thành nhiều Frame ta dùng tag đặt ngay sau tag . Cú pháp: Trong đó: a: Chiều cao của Frame đầu tiên *: Chiều cao của Frame thứ hai là khoảng trống còn lại. b: Chiều cao của Frame thứ 3 Nếu ta sử dụng nhiều dấu “*” th ì không gian còn lại của cửa sổ sẽ được chia đều cho các Frame có dấu “*”. Ví dụ: Mã HTML Tạo Frame kết quả hiển thị trên màn hình 23
  25. Thêm thanh cuộn cho Frame ta dùng thuộc tính SCROLLING = yes/no trong tag FRAME tương ứng để ẩn/hiện thanh cuộn. Nếu không có thuộc tính SCROLLING thì thanh cuộn sẽ xuất hiện khi cần thiết. Thêm thuộc tính NORESIZE vào tag FRAME cho Frame tương ứng để không cho người dùng thay đổi kích thước của Frame đó. Thêm thuộc tính FRAMEBORDER=”yes/no/0” vào tag để hiện/ẩn khung viền cho Frame. Chọn “yes/0” cho tr ình duyệt Internet Explorer và “yes/no” cho trình duyệt Netscape. Thêm thuộc tính Border vào tag để định độ dày mỏng viền của Frame. Thêm Framespacing=”n” vào tag để định khoảng cách từ viền khung tới nội dung trong khung. 2.6.2. Tạo Frame có dạng cột Cú pháp: ý nghĩa của các thuộc tính tương tự tạo Frame có dạng hàng. 2.6.3. Kết hợp tạo Frame vừa dạng hàng vừa có dạng cột Trong một trang Web việc tạo Frame thường được kết hợp giữa tạo Frame có dạng hàng và Frame có dạng cột. Ví dụ: Trong ví dụ này ta chia trang Web thành 4 Frame:1 Frame trên, 1 Frame trái, 1 phải và 1 Frame dưới. Mã HTML Danh sach cac mon hoc Kết quả hiển thị trên trình duyệt 2.7. Các hiệu ứng Dynamic HTML (DHTML) 2.7.1. Tạo chuỗi ký tự chuyển động Cú pháp: Các thuộc tính: BEHAVIOR=type, type có thể là: scroll để chuỗi ký tự bắt đầu từ một bên màn hình và biến mất ở bên kia, slide để chuỗi bắt đầu tại một bên 24
  26. màn hình và dừng lại ở bên kia, alternate để chuỗi bắt đầu bên này màn hình và chuyển động ngược lại khi đến bên kia. DIRECTION=”left/right”: định hướng bắt đầu chạy. LOOP=n: số lần chuyển động ngang qua m àn hình, nếu LOOP=infinite thì chuỗi sẽ xuất hiện liên tục. VSCROLLAMOUNT=n : tốc độ chuyển động. SCROLLDELAY=n: thời gian ngừng sau một vòng chạy. Nếu không có các thuộc tính trên thì chuyển động lặp đi lặp lại từ lề phải sang lề trái với tốc độ=6 (pixel) và thời gian dừng=90 giây. Ví dụ: Ta xét đoạn chương trình sau: Mã HTML Chuoi ky tu chay L ớp chuyên viên công nghệ thông tin Kết quả hiển thị trên trình duyệt 2.7.2. Thay đổi hình dạng chuột khi đi qua một ô tron g bảng Cú pháp: Các thuộc tính và các dạng cursor tương ứng. Auto Hand Move Text Wait Help Default Crosshair Beam_r.cur Harrow.cur Move_im.cur Beam_r.cur Busy_m.cur Help_l.cur Larrow.cur Lcross.cur Ví dụ: Đoạn chương trình sau mô phỏng các dạng Cursor Cursor auto hand move text wait help default 25
  27. crosshair Bài tập chương 2 Bài 1: Thiết kế trang chủ chương trình đào tạo chuyên viên ( trang gồm 3 Frame như hình sau, toàn bộ trang sử dụng font chữ là “Times New Roman”. Frame trên cùng gồm có một hình bên trái, bên phải là các dòng chữ chạy. Frame bên trái là các mục cần đưa tin. Frame giữa dùng để hiển thị nội dung tin. Bài 2: Thiết kế trang Web Giáo dục ( Bài 3: Thiết kế trang Web thường truy cập có địa chỉ sau: - (trang chủ trung tâm tin học TP.HCM) - - - - - - Ghi chú: - Để xem mã HTML của trang Web hiện hành ta vào Menu sau đó chọn View->Source. - Để lưu trang Web hiện hành ta vào menu sau đó chọn File->Save as Chương 3: GIớI THIệU NGÔN NGữ SCRIPT VBSCRIPT Và JAVASCRIPT 1.Giới thiệu ngôn ngữ vbscript và JavaScript VBscript và JavaScript là ngôn ngữ lập ra để chạy được trên trình duyệt, các đoạn chương trình viết bằng ngôn ngữ này được nhúng vào các trang HTML. Các đoạn chương trình này có khả năng: Được thực thi khi một sự kiện nào đó trên trang Web xảy ra như: mouseclicked, mouseover, Xử lý các thành phần trên trang Web như: thay đổi màu chữ, font chữ, thay đổi ảnh, Cú pháp của VBScript gần giống với cú pháp ngôn ngữ lập tr ình VisualBasic và được Microsoft phát triển, trong khi cú pháp của JavaScript gần giống với cú pháp của ngôn ngữ lập trình C và được NetsCape phát triển. VBScript không phân biệt chữ hoa và chữ thường trong khi JavaScript thì lại phân biệt chữ hoa và chữ thường. JavaScript được hỗ trợ trên hầu hết các trình duyệt, còn VBScript chỉ được hỗ trợ tốt nhất ở trình duyệt Internet Explorer. Cũng giống như các ngôn ngữ lập trình khác các kiểu dữ liệu thông dụng được dùng VBScript và JavaScript là: ki ểu số, kiểu chuỗi, kiểu luận lý, Tuy nhi ên cách 26
  28. định nghĩa các kiểu dữ liệu giữa VBScript và JavaScript có sự khác nhau. Cách khai báo các hàm cũng khác nhau. Cách sử dụng các h àm thư viện có sẵn cũng khác nhau. 2. ngôn ngữ vbscript 2.1. Chú thích một dòng lệnh Chú thích trong VBScript tương tự như Visual Basic bắt đầu bằng ký tự nháy đơn (‘). Dấu chú thích chỉ có tác dụng trên một dòng. Dấu chú thích làm cho các dòng lệnh rõ ràng và dễ hiểu đối với người thiết kế chương trình. Khi thực thi, trình biên dịch bỏ qua dòng ghi chú này. 2.2. Cách khai báo biến, hằng, mảng 2.2.1. Khai báo biến Dùng từ khóa Dim để khai báo biến, biến trong ngôn ngữ VBScript không cần chỉ định kiểu như trong ngôn ngữ lập trình cấu trúc. Các biến không cấu trúc đ ược xem là biến vô hướng (variant) có thể chứa và tự chuyển đổi hầu hết các kiểu dữ liệu. Cú pháp: Dim tên_biến1, tên_biến2,tên_biến3, Các biến được cách nhau bởi dấu phẩy “,”. Tuy nhiên trong VBScript không nhất thiết phải khai báo biến trước khi sử dụng. Để yêu cầu các biến phải được khai báo trước khi sử dụng ta dùng lệnh “Option Explicit” đặt trước lệnh đầu tiên của đoạn chương trình. Ví dụ: Dim a a = 3 Ghi chú: Biến không phân biệt chữ hoa/thường Chiều dài tên biến không vượt quá 255 ký tự. Tên biến phải bắt đầu bằng 1 ký tự chữ cái v à biến không phép chứa dấu chấm “.” 2.2.2. Khai báo hằng Hằng được định nghĩa bằng từ khoá Const. Chỉ có thể sử dụng giá trị của hằng chứ không thể thay đổi nội dung hằng. Ví dụ: Const ten = “Nguyen Van Tuan” 2.2.3. Khai báo mảng Mảng một chiều Dim Ten_mang (kích thước của mảng) Số phần tử tối đa của mảng trên= Kích thước của mảng +1. Chỉ số của phần tử đầu tiên của mảng bằng 0, để truy xuất đến phần tử có chỉ số “i” ta dùng Ten_mang(i);. Ví dụ: Dim A(20); thì mảng A có thể chứa tối đa 21 phần tử Mảng 2 chiều Dim Ten_mang(dòng, cột) Chỉ số của phần tử ở dòng đầu tiên và cột đầu tiên là (0,0). Để truy xuất phần đến phần tử có chỉ số d òng i, chỉ số cột j ta dùng B(i,j). Ví dụ: Dim B(5,10); Mảng B có thể chứa 6 dòng và 11 cột. Trong VBScript ta muốn khai báo một mảng động th ì khi khai báo mảng ta không định rõ kích thước cho mảng. Tức kích thước của mảng có thể thay đổi trong quá trình thao tác, dùng hàm ReDim để thay đổi kích thước của mảng động. Trong VBScript có thể khai báo một mảng có 60 chiều. 27
  29. 2.3. Các kiểu dữ liệu Trong VBScript chỉ có một kiểu dữ liệu duy nhất l à Variant. Đây là kiểu dữ liệu có thể chứa các loại dữ liệu từ kiểu chuỗi, kiểu số cho đến các loại dữ liệu có cấu trúc như kiểu bản ghi (record). Kiểu dữ liệu n ày cũng là kiểu dữ liệu trả về của các hàm và các thủ tục được viết bằng ngôn ngữ VBScript. Tuỳ theo ngữ cảnh sử dụng mà một biến Variant mang giá trị là kiểu số, kiểu chuỗi (hay bất kỳ kiểu dữ liệu nào khác). Ví dụ: Trong biểu thức a=b+1997, thì biến a và biến b mang kiểu dữ liệu là kiểu số. Trong biểu thức a=b+”1997” thì biến a và biến b có kiểu dữ liệu là kiểu chuỗi. Các kiểu dữ liệu mà một biến Variant có thể lưu trữ. Các kiểu dữ liệu ý nghĩa Boolean kiểu luận lý True hoặc False Byte Số nguyên có giá trị từ 0 đến 255 Interger Số nguyên có giá trị từ -32768 đến 32768 Currency Từ -922,337,203,685,477,5808 đ ến 922,337,203,685,477,5807 Long Số nguyên từ -2,147,483,648 đến 2,147,483,647 Single Số thực, có giá trị từ 3.402823E38 đến 1.401298E -45 cho các số âm, từ 1.401298E-45 đến 3.402823E38 cho số dương Double Số thực, có giá trị từ 1.79769313486232E308 đến 4.94065645841247E-324 cho các số âm, 4.94065645841247E-324 đến 1.79769313486232E308 Date(time) chứa giá trị ngày từ 01.01.100 đến 31.12.9999 String Chuỗi ký tự có thể chứa 2 tỉ ký tự Empty dữ liệu chưa được khởi tạo Null Null Object Chứa đối tượng trên Form như hộp văn bản, nhãn, nút nhấn, Error chứa mã lỗi Để chuyển đổi dữ liệu này sang kiểu dữ liệu khác ta dùng các hàm thư viện Cbyte (kiểu byte), Cdate (kiểu ngày), CInt (integer), CStr (string), SBool (bool), CDbl (double), CLng (long), CSng (Single) Muốn biết kiểu dữ liệu mà một biến có kiểu Variant đang lưu trữ ta dùng hàm thư viện VarType. 2.4. Các toán tử cơ sở Toán tử gán (=) Tên_biến = Biểu thức. Với các biến có kiểu dữ liệu tổng quát, để gán giá trị cho biến chúng ta d ùng, ta phải dùng lệnh Set như sau: Set tên_biến = Biểu thức Toán tử tính toán +(cộng), -(trừ), *(nhân), \(chia lấy phần nguyên), /(chia làm tròn), ^(luỹ thừa), mod (chia lấy phần dư) 28
  30. Toán tử nối chuỗi Dùng &: Ví dụ: S = “Dai” & “ ” & “hoc” Dùng + : Ví dụ: S = “Dai” + “ ” + “hoc” Toán tử so sánh = (bằng), > (lớn hơn), >= (lớn hơn hay bằng), (khác). Kết quả của một biểu thức so sánh sẽ thuộc về kiểu lý luận (True/false), khi cần nối các biểu thức so sánh với nhau ta dùng toán tử luận lý And, Or 2.5. Các lệnh xử lý điều kiện rẽ nhánh Bạn có thể sử dụng các lệnh rẽ nhánh if then, if then else hoặc Select case để ra điều kiện rẽ nhánh dựa trên các biểu thức so sánh. 2.5.1. Cấu trúc If Then Dùng để xử lý lệnh khi biểu thức so sánh của If trả về giá trị True Ví dụ: Dim myDate myDate = #2/12/2000# if myDate Case Khối lệnh 1 Case Khối lệnh 2 Case Else Khối lệnh i 29
  31. End Select Ví dụ: Select case Dim Thang Thang = 13 document.Write(“Thang”) document.Write(Thang) SELECT CASE Thang CASE 2: document.Write(“co 28 ngay”) CASE 1,3,5,7,8,10,12 : document.Write(“co 31 ngay”) CASE 2: document.Write(“co 28 ngay”) CASE 4,6,9,11 : document.Write(“co 30 ngay”) CASE ELSE document.Write(“khong hop le”) END SELECT Mệnh đề Case Else trong cú pháp Select case d ùng trong trường hợp tất cả các phép so khớp của mệnh đề Case không xảy ra. 2.6. Cấu trúc lặp Tương tự các ngôn ngữ lập trình khác, VBScript cung cấp các lệnh lặp dựa trên điều kiện. Dùng cấu trúc Exit for, Exit do, Exit While để thoát khỏi cấu trúc lặp tương ứng. 2.6.1. Cấu trúc Do Loop Cấu trúc Do Loop lặp trong khi điều kiện kiểm tra của Loop còn đúng. Có 4 cấu trúc lặp theo cú pháp sau: Do While Khối lệnh Loop Do Khối lệnh Loop While Do Khối lệnh Loop Until Ví dụ: Tính giá trị N! Dim N, i, S N=3 S=1 i=1 DO WHILE (i<=n) S=S*i i=i+1 30
  32. LOOP 2.6.2. Cấu trúc While Wend Lặp trong khi điều kiện kiểm tra của While còn đúng. Theo cú pháp sau: While Khối lệnh Wend Ví dụ: Tính tổng S = 1+2+3+5+ +N Dim i,S,N N=5 i=1 S=0 WHILE (i To Khối lệnh Next For To Step Khối lệnh Next Ví dụ: Tính tổng S = 1+2+3+4+ +N Dim d ‘ Tao doi tuong DictionarySet d = CreateOject(“Scripting.Dictionary”) ‘ Luu cac phan tu vao tap hop d.Add “0”, ”Athens” d.Add “1”, “Belgrade” d.Add “2”, “Cairo” ‘ Duyet va in cac phan tu trong tap hop For Each I in d document.Write(D.Item(I)) Next 2.6.4. Cấu trúc For each Next Cấu trúc For each Next lặp với mỗi phần tử trong tập Ví dụ: Dim d ‘Tạo doi tuong DictionarySet d=CreateObject(“Scripting.Dictionary”) ‘Luu cac phan tu vao tap hop d.Add “0’,”Athens” 31
  33. d.Add ”1”, “Belgrade” d.Add “2”, “Cairo” ‘ Duyet va in cac phan tu trong tap hop For each i in d document.Write(D.Item(I)) 2.7. Khai báo hàm và thủ tục 2.7.1. Khai báo hàm Function Tên_hàm (các tham số) Khối lệnh End Function Ví dụ: Xây dựng hàm tính diện tích hình tròn khi biết bán kính Function DienTich(R) Dim S S = 3.14*R*R DienTich=S document.Write(S) End Function 2.7.2. Khai báo thủ tục Sub Tên_thủ_tục(các tham số) khối lệnh End Sub Ví dụ: Xây dựng thủ tục gọi sử dụng hàm DienTich đã viết trên Sub SuDung() DienTich(5) End Sub 32
  34. Chương 3. Ngôn ngữ JAVASCRIPT 3.1. Chú thích một hay nhiều dòng lệnh Dòng lệnh được kết thúc bằng dấu chấm phẩy “;” ở cuối d òng. Tập hợp các dòng lệnh nằm trong hai dấu ngoặc đơn {} gọi là tập lệnh. Muốn chú thích một dòng lệnh ta dùng dấu “//” đặt trước dòng lệnh muốn chú thích. Muốn chú thích nhiều dòng lệnh thì ta đặt các dòng lệnh cần chú thích giữa hai dấu “/*” và “*/”. 3.2. Cách khai báo biến, mảng 3.2.1 Cách khai báo biến Dùng từ khoá var để khai báo biến. Biến trong JavaScript không cần định r õ kiểu dữ liệu của biến lúc khai báo. Tuy nhi ên, khi gán giá trị cho biến, JavaScript phân biệt kiểu của các giá trị mà bạn gán. Trong JavaScript bắt buộc phải khai báo biến trước khi sử dụng. var tên_biến1 = trị1 ,tên_biến2 =trị2 , ; Chú ý: + Biến có phân biệt chữ hoa/thường. + Biến phải bắt đầu bằng ký tự chữ cái. + Biến không cho phép có khoảng trắng, không cho phép có dấu ghạch ngang. 3.2.2. Khai báo mảng Mảng một chiều var A = new Array(10) Mảng A nói trên có 10 phần tử, và chỉ số phần tử đầu tiên của mảng bắt đầu 0, muốn truy xuất đến phần tử có chỉ số i, ta d ùng A[i]. Mảng 2 chiều Khai báo A là mảng 2 chiều có 10 dòng, 20 cột. var A = new Array(10),i = 0; for (i = 0; i (lớn), >= (lớn hơn hay bằng), = = (bằng), != (khác). 3.3.2. Kiểu ký tự Các ký tự được nằm giữa 2 nháy đơn. Ngoài ra còn có các ký tự đặc biệt sau đây: 33
  35. Ký tự ý nghĩa \n Xuống dòng mới \t Ký tự tab \r Về đầu dòng \b Ký tự khoảng trắng Ví dụ: var ch= “A”, c= “B”; Các phép toán trên ký tự +, += (cộng 2 ký tự) Phép toán so sánh : >, >=, , >=, = =, != 3.3.4. Kiểu luận lý Một biến có kiểu luận lý tồn tại 1 trong 2 trạng thái: true,false. Ví dụ: var t = true, f = false; Các phép toán trên kiểu luận lý Phép so sánh: , >=, = =, != Phép logic: && (và), || (hoặc), ! (phủ định). 3.3.5. Kiểu ngày Mô tả thông tin về: Ngày, Tháng, Năm, giờ, phút, giây của hệ thống. Ví dụ: var now = new Date(); Các hàm lấy ngày giờ trong đối tượng Date như sau: Tên hàm Mô tả GetDate() Ngày: 1 31 GetDay() Ngày trong tuần: 0 (chủ nhật), 1 (thứ 2) GetHours Giờ: 0 23 GetMinutes Phút: 0 59 GetMonth Tháng: 0 (tháng 1) 11 (tháng 12) GetSeconds Giây:0 59 GetTime Giờ theo mili giây GetYear Năm Ví dụ: Ví dụ lấy ngày hệ thống và hiển thị lên trình duyệt Mã HTML Outputting Text 34
  36. Ngoài các kiểu dữ liệu thông dụng trên còn có các kiểu dữ liệu object, null. 3.4. Các lệnh xử lý điều kiện rẽ nhánh 3.4.1. Cấu trúc if Dùng để xử lý lệnh khi biểu thức của if trả về giá trị true if (biểu thức điều kiện) Khối lệnh; 3.4.2. Cấu trúc if else if (biểu thức điều kiện) Khối lệnh 1; else Khối lệnh 2; Ví dụ: if(a%2==0) document.Write(a, “là số chẵn”); else document.Write(a, “là số lẻ”); 3.4.3. Cấu trúc switch case Cho phép thực hiện nhiều lựa chọn để ra quyết định thực thi. switch(biến) { case giá trị 1: Khối lệnh 1; break; case giá trị 2: Khối lệnh 2; break; default: Khối lệnh n; break; } 3.5. Cấu trúc lặp 35
  37. Dùng câu lệnh break để thoát khỏi cấu trúc lặp khi cần. 3.5.1. Cấu trúc for for (biểu thức khởi tạo; biểu thức điều kiện; biểu thức thay đổi) Khối lệnh; Khối lệnh được thực hiện khi biểu thức điều kiện còn đúng. Ví dụ:for (i=0;i<10;i++) s+=2*i; 3.5.2. Cấu trúc While While (biểu thức điều kiện) Khối lệnh; Khối lệnh được thực hiện khi biểu thức trong While còn đúng. Ví dụ:i=0; While(i<20) { s+=i; i++; } 3.5.3. Cấu trúc do While do Khối lệnh; While(biểu thức điều kiện); Khối lệnh được thực hiện trước sau đó kiểm tra biểu thức điều kiện nếu còn đúng thì quay lên thực hiện khối lệnh. Ví dụ: i=0; do { s+=i; i++; }While(i<20); 3.6. Khai báo hàm Dùng từ khoá function để khai báo hàm. Muốn trả về giá trị của hàm ta dùng từ khoá return. function tên_hàm(danh sách các tham số) { Khối lệnh; } Ví dụ: function Add(x,y) { return(x+y); } var t; document.Write(t) 36
  38. Chương 4. sử dụng vbscript và javascript trong trang web 4.1. Chèn đoạn VBScript/JavaScript vào trang HTML Các đoạn Script nằm giữa tag và , trong đó ghi rõ ngôn ngữ sử dụng để viết mã chương trình. Các đoạn Script được đặt giữa cặp tag và hay đặt giữa cặp tag Và . Tuy nhiên, nếu đặt giữa tag thì các đoạn mã này đã được đọc và thông dịch trước các thành phần nằm trong tag . Dùng tag để báo cho trình duyệt không hiển thị các đoạn mã bên trong nếu nó không hiểu tag . Ví dụ: Trong ví dụ sau ta viết một hàm tính diện tích hình vuông (viết bằng VBScript), một thủ tục tính diện tích hình chữ nhật (viết bằng JavaSript). Mã HTML Tinh dien tich 37
  39. kết quả hiển thị trên trình duyệt Dien tich hinh vuong=25 Dien tich hinh tron=78.5 4.2. Xuất/nhập dữ liệu trong VBScript v à JavaScript 4.2.1. Xuất dữ liệu Đối tượng document là đối tượng đại diện cho trang Web hiện hành. Còn đối tượng window thì đại diện cho cửa sổ mà trong đó trang web hiển thị. Để xuất dữ liệu ra trang Web ta d ùng hàm write và hàm writeln của đối tượng document theo cú pháp. document.write(“chuỗi cần hiển thị”) document.writeln(“chuỗi cần hiển thị”); Chúng ta có thể dùng các tag HTML để xuất dữ liệu trong các đoạn Script Ví dụ: document.write(“ Hello Script ”) Để writeln (xuất dữ liệu và về đầu dòng mới) có tác dụng ta phải dùng kèm theo tag và đứng trước và sau đoạn Script. Ví dụ: Hello JavaScript ”) document.write(“ Hello VBScript ”) > Để hiển thị các hộp thông báo ta d ùng hàm confirm và hàm alert của đối tượng window. Theo cú pháp sau: window.alert(“chuỗi cần hiển thị”) window.confirm(“chuỗi cần hiển thị”) Đối với VBScript để hiển thị hộp thông báo ta dùng hàm MsgBox(“chuỗi cần thông báo”); 4.2.2. Nhập dữ liệu Dùng hàm promt của đối tượng window để nhập giá trị cho biến theo cấu trúc sau: Biến = window.promt(“chuỗi thông báo”,”trị mặc nhiên”) Biến = InputBox(“chuỗi thông báo”) 5. xử lý các sự kiện khi tương tác với các thành phần trên trang web Sự kiện được phát sinh khi ta kích hoạ t (onClick, onMouseOver, onMouseOut ) các thành phần trên trang web như các nút đi ều khiển Button, hyperlink, ListBox 38
  40. Để xử lý các sự kiện này ta tạo hàm xử lý sự kiện và gán hàm xử lý sự kiện đó cho tên sự kiện = Ví dụ 1: Tạo 2 nút bấm (OK, Cancel), thủ tục xử lý sự kiện khi Click nút OK đ ược viết bằng VBScript, hàm xử lý sự kiện khi nhấn nút Cancel đ ược viết bằng ngôn ngữ JavaScript. Mã HTML Click Button kết quả hiển thị trên trình duyệt Ví dụ 2: Kiểm tra tính hợp lệ của dữ liệu nhập từ Form. Nếu thiếu th ì thông báo cho người dùng biết, ngược lại thông báo câu “dữ liệu đ ã đầy đủ”. Mã HTML KIEM TRA DU LIEU NHAP function KiemTraForm() 39
  41. { Nhap ten Nhap tuoi Nhap ngay sinh nhat     Kết quả hiển thị trên màn hình Bài tập chương 3 Bài 1: Thiết kế Form nhập liệu như hình sau, khi nhấn chọn nút chấp nhận thì phải kiểm tra tính đầy đủ và hợp lệ của dữ liệu. Nếu thông tin n ào không có hoặc bị sai thì 40
  42. yêu cầu người dùng bổ xung. Nếu người dùng nhấn chọn nút không chấp nhận thì làm rỗng tất cả các thông tin trên Form để chuẩn bị cho lần đăng ký kế tiếp. Bài 2: Tương tự như bài 1, chúng ta thiết kế Form đặt hàng mua áo thun qua mạng như sau: Khi khách hàng nhấn chọn nút chấp nhận thì phải kiểm tra tính đầy đủ và hợp lệ của dữ liệu. Nếu dữ liệu đúng th ì thông báo câu “Bạn đã đặt hàng thành công”, nếu không hợp lệ thì yêu cầu người mua hàng điền thông tin lại cho hợp lệ. Trong trường hợp người đặt hàng nhấn chọn nút bỏ qua thì phải làm rỗng các thông tin trên Form để chuẩn bị cho lần đặt mua hàng kế tiếp. Bài 3: Chúng ta thiết kế trang web đăng ký mail của Yahoo ( khi nhấn vào nút Submit this Form thì phải kiểm tra tính đầy đủ và hợp lệ của dữ liệu. Nếu không đúng hay thiếu th ì yêu cầu người dùng nhập lại. Chương 4: lập trình web động với ngôn ngữ lập trình asp 1.giới thiệu về asp ASp (Active Server Page) ngôn ngữ lập trình ứng dụng được chạy bên phía Server. Một trang ASP có các đặc điểm sau: Một trang ASP được lưu với phần mở rộng “.asp” Các ứng dụng ASP dễ viết, dễ sửa đổi. Cung cấp chế độ bảo mật tốt vì các mã code trong trang ASP ng ười duyệt web không thể thấy được. Ngôn ngữ Script được dùng thông dụng nhất trong trang ASP là VBScript. Được hỗ trợ bởi trình chủ Web Server IIS (Internet information server) v à Personal Web Server (PWS là trình chủ web được dùng trên win98). Tuy nhiên, IIS là thông dụng nhất. Ngoài ASP còn có một số ngôn ngữ lập trình web động như JSP, PHP Như vậy để thực thi một trang ASP ta cần c ài trình chủ Web Server IIS. Để cài IIS, sau khi đưa đĩa Win2K/WinXP vào ta chọn menu Start-> Settings- > Control Panel-> Add/Remove Programs-> Add/Remove windows components -> chọn Internet Information Server s -> Next 2. nạp một ứng dụng web lên trình chủ iis Sau khi cài trình web chủ IIS, để xem một trang ASP trước tiên ta phải nạp ứng dụng chứa trang ASP lên trình chủ Web IIS, các bước thực hiện như sau: Bước 1: Mở trình chủ web IIS bằng cách vào menu Start -> Settings -> Control Panel -> Administrative Tools -> Internet Services Manager. Bước 2: Tạo thư mục ảo (Virtual Directory) cho ứng dụng. Thông th ường mỗi ứng dụng web được đặt trong một thư mục và được tham chiếu đến thông qua địa chỉ URL. . Cách tạo thư mục ảo: Trên màn hình Internet Information Services ta vào Default Web Site -> New -> Virtual Directory. . Trong ô nhập liệu Alias của hộp thoại Virtual Directory Creation Wizard ta nhập tên bí danh cho thư mục ảo, bấm next. . Chọn đường dẫn thư mục vật lý chứa ứng dụng ta quan tâm. Thông thường thư mục chứa ứng dụng được đặt trong C:\Inetpub\wwwroot, 41
  43. chọn thư mục vật lý chứa ứng dụng xong ta bấm Next để đến m àn hình cấu hình bảo vệ và đặt quyền cho thư mục ảo. . Đặt quyền cho thư mục ảo như trong hình 4.4. Có tất cả 5 quyền gồm Read (cho phép đọc nội dung trang), Runscript (cho phép thực thi trang kịch bản), Execute (thực thi các ứng dụng CGI), Write (cho phép ghi vào thư mục ảo), Browse (cho phép xem toàn bộ nội dung thư mục thay cho trang web mặc định). Hai quyền Read và Run script là cần thiết để trang ASP có thể truy xuất được. . Chúng ta đặt lại các quyền bảo vệ thư mục ảo và chế độ bảo mật bằng cách nhấn chuột phải lên thư mục ảo mới tạo, rồi vào Properties. Bước 3: Thiết lập trang mặc định cho thư mục ảo Khi máy client gõ một địa chỉ Web URL tham chiếu đến một ứng dụng m à không đưa ra tên trang cụ thể, lúc này trình chủ sẽ sử dụng trang mặc định. Ta có thể thiết lập một danh sách các trang mặc định, khi ấy IIS sẽ t ìm theo thứ tự ưu tiên từ trên xuống dưới. Để lập trang Web mặc định cho th ư mục ảo. Từ màn hình 4.5 ta vào mục Document. Bạn có thể xoá hoặc thêm một trang mặc định vào danh sách bằng cách chọn Add hay Remove. Bước 4: Để xem trang web ta mở trình duyệt web Internet Explorer -> gõ địa chỉ của URL của trang web vào mục Address Nếu chúng ta đã tạo trang mặc định cho thư mục ảo là “index.asp” thì ta chỉ cần gõ địa chỉ 3. các khái niệm cơ bản về asp 3.1. Thành phần cơ bản của một trang ASP Một trang ASP thông thường có 4 phần: Dữ liệu văn bản Các tag HTML Các đoạn mã chạy phía Client nằm trong đoạn tag Các đoạn mã ASP được chạy phía Server nằm trong tag Như vậy một trang ASP là một trang HTML được nhúng thêm phần xử lý viết bằng mã HTML. Ta có thể sử dụng nhiều ngôn ngữ Script khác nhau để viết trang ASP, v ì thế ta phải chỉ định Script nào được sử dụng trong trang, bằng khai báo ở đầu trang. Ví dụ: Khai báo ở đầu trang để sử dụng ngôn ngữ VBScript. Ví dụ: Trang ASP sau là sự kết hợp giữa các đoạn ASP, HTML v à JavaScript. Đoạn chương trình sau xuất hiện ra màn hình câu thông báo “Good Morning” khi th ời gian hệ thống ở thời điểm buổi sáng, c òn thời gian buổi chiều thì in ra câu “Hello” <% Dim dtmHour dtmHour=Hour(Now()) if dtmHour<12 Then 42
  44. %> Good Morning! Hello! 3.2. Nhập/Xuất dữ liệu Để xuất dữ liệu của đoạn chương trình chạy phía Client (được đặt trong cặp tag ) dùng phương th ức document.write. Tương tự, để xuất dữ liệu trong đoạn chương trình ASP (đoạn lệnh được đặt trong tag ) dùng phương thức Response.write. Ví dụ: Xuất chuỗi: Response.write”Learn ASP” Xuất hằng kiểu số: Response.write 5 Xuất giá trị của biến a: Response.write a Để nhập dữ liệu ta dùng phương thức Request Cụ thể hai phương thức yêu cầu (Request), trả lời (Response) sẽ được đề cập cụ thể ở mục 4.1 và 4.2 3.3. Hoạt động của ASP Khi một trang ASP được trình duyệt Web yêu cầu, trước tiên Web Server sẽ duyệt tuần tự trang ASP này và chỉ thực hiện những câu lệnh kịch bản ASP, kết quả l à một trang thuần HTML sẽ được đưa ra browser. Việc đưa ra kết quả cho browser lần lượt hay sau khi dịch xong tất cả các kịch bản l à do người tạo lập trang Web qui định. Người dùng sẽ không thấy được các lệnh kịch bản của ASP bởi v ì nó đã được server thực thi xong rồi gửi kết quả về cho browser d ưới dạng trang HTML. 4. các đối tượng cơ bản trong ASP Đối tượng là khái niệm trừu tượng nói về một “vật thể” (hay một structure) có khả năng lưu trữ dữ liệu và thao tác trên các dữ liệu để phục vụ cho một công việc n ào đó. Trong đối tượng người ta gọi các dữ liệu là các thuộc tính còn các thao tác là các phương thức. Các đối tượng trong ASP cho phép người lập trình giao tiếp, tương tác với cả server lẫn client. Trong ASP có hai loại đối t ượng là : Các đối tượng cơ bản: Application, Session, Server, Request, Response, ObjectContext. Các thành phần (component) xây dựng sẵn: Dictionary, FileSystemObject, AdRotator, Browser Capabilities 4.1. Đối tượng Request Khi người dùng yêu cầu một trang hay đệ trình (submit) một biểu mẫu (form), đối tượng Request sẽ lưu trữ và cung cấp tất cả các thông tin từ browser (trình duyệt Web) gửi đến server, đối tượng này được xem như là đối tượng nhận dữ liệu. Các tập 43
  45. hợp (collection), thuộc tính (properties) v à phương thức (method) của đối tượng này được mô tả như sau: 4.1.1. Các tập hợp (Collection) của đối tượng Request Đối tượng Request cung cấp 5 collection cho phép chúng ta truy xuất tất cả các loại thông tin về yêu cầu của browser đối với server. Các collection của đối tượng Request bao gồm: Client Certificate Một tập các giá trị của tất cả các tr ường (field) hay các mục (entry) trong Client Certificate mà browsẻ chuyển đi để trình cho server khi truy xuất một trang hay tài nguyên. Các thành phần của tập đều là giá trị chỉ đọc (read - only). Cookies Cookies là một file văn bản có kích thước nhỏ được lưu trữ trên máy client. Mỗi khi người dùng thăm một Website, ta có thể bí mật gắn một tập tin chứa các thông tin mà mình muốn lên đĩa cứng của họ, chẳng hạn như thông tin về user, thông tin về số lần truy cập website, Tuy nhiên các Cookies không phải được truy cập ngẫu nhiên bởi các Website mà chúng được truy cập bởi các domain tạo ra chúng. Các Cookies trong đối tượng Request đều là thuộc tính chỉ đọc (read-only) do đó ta chỉ có thể xem các giá trị cookies m à không thể sửa đổi giá trị của chúng. Để lấy giá trị của Cookies ta sử dụng cú pháp sau: Request.Cookies(name)[(key)].attribute Trong đó: name: tên của cookies (kiểu chuỗi). key: khoá của cookie cần lấy giá trị (kiểu chuỗi). attribute: thông tin của cookie, là một trong các thông số sau: + Domain: (chỉ đọc- read only) cookie chỉ được gửi cho đối tượng Request của domain này. + Expires: (chỉ ghi- write only) chỉ định ngày mà Cookies hết hiệu lực (expires), nếu không chỉ định ngày thì cookie sẽ expires khi kết thúc phiên làm việc. + HasKeys: (chỉ đọc – read only) xác định khoá của cookie có tồn tại không. + Path: (chỉ ghi- write only) nếu thuộc tính này được xác lập thì chỉ cookie chỉ được gửi cho những Request của đ ường dẫn này, nếu không thì cookie chỉ được gửi cho những Request thuộc đường dẫn của ứng dụng. + Secure: (chỉ ghi- write only) xác định cookie có bảo mật hay không. Một cookie có thể chứa đựng một tập hợp các giá trị. Ta nói cookie đó có nhiều khoá. Ví dụ: ”) If Request.Cookies(x).HasKeys Then 44
  46. For each y in Request.Cookies(x) Response.write(x & “:” & y & “=” & Request.Cookies(x)(y)) Response.write(“ ”) Next Else Response.Write(x & “=”& Request.Cookies(x) & “ ”) End If Response.write “ ” Next %> Form Các Form cho phép người dùng nhập vào dữ liệu thông qua các control HTML như edit, radio button, check box, Khi ngư ời dùng submit một biểu mẫu thì tất cả các giá trị của các control trong phân đoạn sẽ được gửi lên Web Server khi đặt giá trị của thuộc tính METHOD trong tag là POST. Các thành phần của đối tượng này đều là giá trị chỉ đọc (read only). Để truy xuất các giá trị của các control HTMl m à người dùng submit bằng phương thức POST ta sử dụng cú pháp sau: Request.Form(controlname) Trong đó controlname là tên của control mà ta cần lấy giá trị. Ví dụ: Chao ban: QueryString Khi người dùng yêu cầu 1 trang đệ trình (submit) một biểu mẫu với phương thức GET thì tất cả các control HTML trong phân đoạn của biểu mẫu sẽ được Browser gắn vào URL theo từng cặp tên/giá trị. QueryString được dùng để lấy về các giá trị trong một biểu mẫu với ph ương thức là GET. Tất cả các thông tin được gửi từ biểu mẫu với phương thức GET sẽ được gắn vào URL trên thanh address của browser và do đó mọi người có thể thấy được các thông tin này, tuy nhiên lượng thông tin được gửi này có giới hạn. Các thành phần của tập đều là giá trị chỉ đọc (read-only). 45
  47. Để truy xuất các giá trị của các control HTML m à người dùng submit bằng phương thức GET ta sử dụng cú pháp sau: Request.QueryString(controlname) Ví dụ: Chao ban: Response.Write(Request.QueryString(“Ho_Lot”)) Response.Write(“ ” & Request.QueryString(“Ten”)) ServerVariables Khi cần lấy giá trị các biến môi trường của Server ta dùng tập ServerVariables Cú pháp: Request.ServerVariables(variable) với variable chỉ định giá trị gì ta cần lấy. Sau đây là một số giá trị tiêu biểu của variable Biến Mô tả ALL_HTTP Trả về tất cả các header mà client đã gửi, luôn luôn theo sau HTTP và viết hoa AL_RAW Trả về tất cả các header ở dạng thô APPL_MD_PATH Trả về đường dẫn cho ứng dụng dùng cho DLL_ISAPI APPL_PHYSICAL_PATH Trả về đường dẫn vật lý tương ứng của đường dẫn. AUTH_PASSWORD Trả về giá trị đã nhập vào trên hộp thoại xác nhận của client AUTH_TYPE Cách thức mà server dùng để kiểm tra xác nhận người dùng(username) AUTH_USER Trả về tên của người dùng (username) CERT COOKIE Trả về ID duy nhất của client CONTEXT_LENGTH Trả về kích thước của dữ liệu mà client gửi CONTEXT_TYPE Trả về kiểu dữ liệu GATEWAY_INTERFACE HTTP_ Trả về giá trị chứa trong header headername HTTP_USER_AGENT Trả về một chuỗi mô tả browser gửi yêu cầu LOCAL_ADDR Trả về địa chỉ của server mà browser gửi yêu cầu tới. Ví dụ: Bạn có thể dùng vòng lặp để xem tất cả các biến của server nh ư sau: ”) Next 46
  48. %> 4.1.2. Thuộc tính (Property) của đối tượng Request Đối tượng Request chỉ có một thuộc tính duy nhất đó l à TotalBytes. Thuộc tính TotalBytes là thuộc tính chỉ đọc (read- only), nó trả về số byte dữ liệu mà người dùng chuyển lên server 4.1.3. Phương thức (method) của đối tượng Request Đối tượng Request cũng chỉ có một ph ương thức đó là BinaryRead. Phương thức BinaryRead được dùng để lấy dữ liệu đã được client POST lên Server. Phương thức này trả về một mảng các giá trị. Cú pháp: Request.BinaryRead(count) trong đó count là một con số nguyên chỉ rõ số byte cần đọc. Phương thức này sẽ không nhận được dữ liệu nếu trước đó ta đã truy xuất đến tạp Request.Form. Ngược lại nếu ta đã gọi phương thức này thì ta sẽ không nhận được dữ liệu của các control HTML khi truy xuất tập Request.Form. Ví dụ: Dùng phương thức BinaryRead để đọc dữ liệu mà client POST lên và đưa vào một mảng. 4.2. Đối tượng Response Khi client có yêu cầu một trang từ server thì server có nhiệm vụ thực thi các đoạn VBScript trong trang ASP để tạo ra tập tin HTML rồi sau đó gửi cho client. Đối tượng Response sẽ đảm nhiệm việc chuyển kết quả từ server cho client. 4.2.1. Các tập hợp (Collection) của đối tượng Response Tập hợp của đối tượng Response chỉ có cookies. Đối tượng Response có thể xác lập giá trị của bất kỳ cookies nào mà ta muốn đặt trên hệ thống của client. Nếu cookies không tồn tại trên client thì nó sẽ được tạo ra. 4.2.2. Thuộc tính (property) của đối tượng Response Buffer: Dùng để xác định xem kết quả tạo ra bởi trang ASP có đ ược giữ lại trong vùng đệm hay không. Thuộc tính Buffer nhận 1 trong 2 giá trị l à true hoặc false. Nếu nhận giá trị True thì kết quả được tạo ra bởi trang ASP sẽ được server giữ trong vùng đệm cho đến khi tất cả các script của trang được xử lý xong, hay đến khi phương thức Flush hoặc phương thức End được gọi. Giá trị này cần được xác lập trước tag trong tập tin .asp. C òn nếu thuộc tính Buffer nhận giá trị False thì kết quả sẽ được gửi đi ngay khi nó được xử lý. Cú pháp: Response.Buffer [= true | false] Trong IIS phiên bản từ 4.0 trở về trước false là giá trị mặc định còn từ phiên bản 5.0 trở về sau thì true là giá trị mặc định. Ví dụ 1: Kết quả sẽ không được gửi tới browser cho đến khi kết thúc v òng lặp. 47
  49. ”) Next %> Ví dụ 2: Kết quả sẽ được gửi tới browser mỗi lần lặp ”) Next %> CacheControl Thuộc tính này dùng để xác định xem proxy server có thể cất giữ kết quả đ ược tạo ra bởi ASP hay không. Mặc định th ì proxy sẽ không cất giữ. CacheControl chỉ có thể nhận một trong hai giá trị đó l à “public” hoặc “private”. Nếu đặt thuộc tính n ày là “private” thì chỉ những vùng cache riêng mới có thể giữ còn proxy server sẽ không lưu trữ những trang này. Còn nếu đặt thuộc tính này là “public” thì proxy sẽ cất giữ những trang này. Ví dụ: hoặc Charset Đây là thuộc tính kiểu chuỗi, thuộc tính n ày ghép tên của tập ký tự vào vùng context-type của đối tượng Response. Thuộc tính này chấp nhận bất cứ chuỗi ký tự nào bất chấp chuỗi đó đúng hay sai. Giá trị mặc định là ISO- LATIN-1. Cú pháp: Response.Charset(charsetname) Ví dụ: ContextType Đây là thuộc tính kiểu chuỗi, thuộc tính n ày đặt kiểu hiển thị của nội dung HTTP cho đối tượng Response. Nếu một trang ASP không chỉ định thuộc tính ContextType thì contend-type mặc định sẽ là: content-type:text/html. Cú pháp: Response.ContentType [= contenttype] 48
  50. Sau đây là một vài giá trị contenttype thông dụng: Ví dụ: Đoạn chương trình sau đây sẽ mở một spreadsheet trên browser (nếu bạn đã cài đặt Excel vào máy ) 1 2 3 4 5 6 7 8 Expires Thuộc tính Expires đặt thời gian bao lâu (tính theo phút) một trang sẽ đ ược cất giữ ở browser trước khi nó hết hạn (expire). Nếu ng ười dùng quay lại trang đó trước khi nó hết hạn thì trang đã cất giữ trước đó sẽ được hiển thị lên. Nếu ta muốn một trang không bao giờ hết hạn thì ta đặt thuộc tính Expire là -1. Cú pháp: Response.Expires [= number] Ví dụ: Nếu ta muốn cho một trang sẽ hết hạn sau 24 giờ (=1400 phút) ta đặt nh ư sau: ExpiresAbsolute: Tương tự như thuộc tính Expires, thuộc tính ExpiresAbsolute đặt một ngày và giờ xác định mà một trang được cất giữ trên browser sẽ hết hạn. Nếu ta chỉ định thời gian mà không chỉ định ngày cụ thể thì trang sẽ hết hạn tại giờ chỉ định vào ngày mà script được thực thi. Còn nếu ta chỉ định ngày mà không chỉ định thời gian thì trang được browser cất giữ sẽ bị hết hạn v ào lúc nửa đêm của ngày chỉ định. 49
  51. Cú pháp: Response.ExpiresAsolute [= [ date][time]] Ví dụ: Đoạn mã sau đây chỉ định rằng trang sẽ hết hạn vào lúc 4h00 chiều ngày 11 tháng 10 năm 2003: IsClientConnected: Thuộc tính này xác định xem client có còn nối kết (connect) với server hay không. Thuộc tính n ày mang 1 trong 2 giá trị đó là true hoặc false. Mang giá trị true nếu cl ient còn kết nối tới server và mang giá trị false trong trường hợp ngược lại. Cú pháp: Response.IsClientConnected Ví dụ: Đoạn code sau đây kiểm tra người dùng còn kết nối hay không? Pics Thuộc tính nay thêm một giá trị vào nhãn Pics ở phần header của đối tượng Response. Ví dụ: by” & chr(34) & “xyz@yahoo.com”& chr(34) & “for” & chr(34) & “ ” & chr(34) & “on” & chr(34) & “2002.10.05T02:15 -0800” & chr(34) & “r (n 2 s 0 v 1 1 2)” ) %> Status Thuộc tính này chỉ định giá trị của dòng trạng thái mà server trả về cho client và ta có thể dùng thuộc tính này để chỉnh sửa dòng trạng thái đó. Giá trị của dòng trạng thái bao gồm: ba con số đầu ti ên là mã trạng thái và mô tả chi tiết của mã trạng thái đó (chẳng hạn như: 404 Not Found). Cú pháp: Response.Status = statusdescription với statusdescription là dòng mô tả trạng thái. Ví dụ: Đoạn code sau đây sẽ kiểm tra quyền của user dựa v ào địa chỉ của họ. “172.16.20.99: Then 50
  52. Response.Status = “401 Unauthorized” Response.Write = (Response.Status) Response.End End If %> 4.2.3 Phương thức (Method) của đối tượng Response AddHeader Phương thức AddHeader thêm một header HTTP mới và một giá trị cho HTTP response. Một khi một header được thêm vào thì ta không thể gỡ bỏ nó ra. Trong IIS 4.0, bạn phải gọi phương thức này trước bất kỳ kết quả nào gửi tới browser. Trong IIS 5.0 bạn có thể gọi phương thức AddHeader tại bất cứ nơi nào trong script nhưng phải đứng trước bất cứ lời gọi hàm Response.Flush nào trong trang. Cú pháp: Response. AddHeader name, value Trong đó name là tên của header còn value là giá trị của header Ví dụ: Chú ý: Tên của header không được chứa dấu gạch dưới. AppendToLog Phương thức này thêm một chuỗi vào cuối mục log của trình chủ. Bạn có thể gọi phương thức này nhiều lần trong một script, mỗi lần gọi sẽ gắn th êm một chuỗi vào mục log của trình chủ. Cú pháp: Response.AppendToLog(string) Ví dụ: Chú ý: Chuỗi cần ghi vào mục log không được chứa bất kỳ dấu phẩy (,) nào. BinaryWrite Phương thức này ghi dữ liệu trực tiếp xuống Browser m à không phải chuyển đổi bất kỳ ký tự nào. Phương thức này thường được dùng để ghi dữ liệu ảnh (BLOB) từ cơ sở dữ liệu xuống browser. Cú pháp: Response.BinaryWrite (data) Clear Phương thức này xoá tất cả các kết xuất HTML được trình chủ đưa vào vùng đệm. Nhưng phương thức này không xoá phần header của đối tượng Response mà chỉ xoá phần nội dung của đối tượng Response. Nếu thuộc tính Buffer của đối tượng Response được đặt là false thì phương thức này sẽ gây ra lỗi lúc thi hành (vì không có vùng buffer thì lấy gì mà xoá!!!) Cú pháp: 51
  53. Response.Clear Ví dụ: Kiểm tra phương thức Clear Đây là phần nội dung của trang Web. Nội dung n ày sẽ được gửi tới người dùng Bắt đầu xoá Buffer Kết quả khi duyệt trang web này là người dùng không thấy gì cả (vì trang HTML mà Server đưa vào trong vùng đ ệm chưa kịp gửi đã bị xoá bởi việc gọi phương thức clear trước khi gọi phương này). Cú pháp: Response.End Ví dụ: Đoạn văn bản này sẽ được gửi tới browser và người dùng có thể đọc được Đoạn văn bản này sẽ không được gửi và đã gọi phương thức End rồi Flush Gọi phương thức này để chuyển các kết xuất HTML mà Server lưu giữ lại trong vùng đệm xuống browser ngay lập tức. Nếu thuộc tính Buffer đ ược đặt là false thì thuộc tính này sẽ gây ra lỗi lúc thi hành. Cú pháp: Response.End Ví dụ: Đoạn văn bản này sẽ được gửi tới người dùng ngay khi gọi phương thức 52
  54. Flush Một số đoạn văn bản khác sẽ được gửi sau một lúc nữa!!! Redirect Phương thức này dùng để chuyển người dùng đến một trang khác được chỉ định trong đường dẫn URL. Cú pháp: Response.Redirect (URL) Ví dụ sau đây minh hoạ việc đăng nhập của ng ười dùng. Tạo tập tin login.asp với nội dung sau: Login to Login Username: Password: Tạo tập tin validate.asp với nội dung sau: <% Dim User, Pass User = Request.Form(“UserName”) Pass = Request.Form(“Password”) If (User = “sv”) and (Pass = “1234”) Then Response.Redirect “success.asp” Else Response.Redirect “login.asp” End If 53
  55. %> Tạo tập tin success.asp với nội dung sau: Bạn đã đăng nhập thành công! Write Phương thức này dùng để ghi dữ liệu ra tập tin kết xuất dạng HTML để gửi cho browser. Dữ liệu này có thể là số, chuỗi, ngày, Cú pháp: Response.Write (text) Ví dụ: ”) Dim x x = 100 Response.Write x %> 4.3. Đối tượng Session Khi bạn mở, đóng ứng dụng hoặc đang l àm việc với một ứng dụng nào đó, máy tính sẽ biết bạn là ai. Nhưng khi làm việc trên internet thì đó là một vấn đề khác: Web Server không biết bạn là ai và bạn làm gì bởi vì dòng địa chỉ htttp:// cung cấp trạng thái của bạn. ASP giải quyết vấn đề này bằng cách tạo ra một cookies duy nhất cho mỗi người dùng, cookies này được gửi cho client và nó chứa đựng thông tin để nhận diện ra bạn. Giao tiếp này được gọi là đối tượng Session. Đối tượng Session được dùng để lưu trữ thông tin về những thay đổi đối với một người dùng. Các biến được chứa trong đối tượng Session chứa thông tin về một người dùng và được dùng chung cho tất cả các trang trong một ứng dụng. Khi có một người dùng mới, server tạo ra một đối tượng Session mới và sẽ huỷ session đó khi người dùng không kết nối nữa hoặc khi session hết hạn. 4.3.1. Tập hợp của đối tượng Session Contents Tập hợp Contents chứa tất cả các phần tử đã được gắn thêm vào đối tượng Session trong quá trình thực thi script. Cú pháp: Session.Contents (key) Trong đó key là tên của phần tử cần lấy. 54
  56. Ví dụ sau đây liệt kê tất cả các session đã được dùng trong ứng dụng. Các session trong t ập Contents ”) Next %> StaticObjects Tập StaticObjects chứa tất cả các đối tượng gắn vào session với tag HTML Cú pháp: Session.StaticObject(key) Ví dụ: Đoạn chương trình sau đây hiển thị tất cả các đối tượng trong tập StaticObjects Các đối tượng trong tập StaticObject ”) Next %> 4.3.2 Các thuộc tính của đối tượng Session CodePage Thuộc tính CodePage cho biết tập ký tự sẽ được dùng để hiển thị nội dung của trang. Sau đây là một vài giá trị CodePage và mô tả của chúng. 1251 – American English and most European languages 932 – Japanese Kanji Cú pháp: Session.CodePage(= codepage) Ví dụ: Đoạn chương trình sau đây hiển thị codepage của một trang. CodePage của trang này là: <% Response.Write (Session.CodePage) 55
  57. %> LCID Ta dùng thuộc tính LCID để thiết lập hay nhận về một con số nguy ên mà nó xác định một vùng nào đó. Dữ liệu ngày, giờ và tiền tệ sẽ được hiển thị dựa theo vùng đó. Cú pháp: Session.LCID(= LCID) Ví dụ: ”) Response.Write (“Dạng tiền tệ:” & FormatCurrency(540)& “ ”) Session.LCID = 1036 Response.Write (“ ”) Response.Write (“LCID hiện tại:” & Session.LCID & “ ”) Response.Write (“Dạng ngày:” & date() & “ ”) Response.Write (“Dạng tiền tệ:” & FormatCurrency(540) & “ ”) Response.Write (“ ”) Session.LCID = 3079 Response.Write (“ ”) Response.Write (“LCID hiện tại:” & Session.LCID & “ ”) Response.Write (“Dạng ngày:” & date() & “ ”) Response.Write (“Dạng tiền tệ:” & FormateCurrency(540) & “ ”) Response.Write (“ ”) %> Khi đó kết quả của trình duyệt sẽ là: SessionID Thuộc tính SessionID trả về một con số id duy nhất dùng để nhận diện cho mỗi người dùng. Con số này được server tạo ra và bạn không thể thay đổi giá trị này được. Cú pháp: Session.SessionID Ví dụ: Đoạn chương trình sau đây hiển thị ra màn hình con số ID Số ID của bạn là: 56
  58. Timeout Thuộc tính này dùng để thiết lập hay nhận về khoảng thời gian hiệu lực d ành cho đối tượng Session trong ứng dụng (tính theo phút). Nếu ng ười dùng không refresh hoặc yêu cầu một trang trong khoảng thời gian hiệu lực đó thì session sẽ kết thúc. Mặc định thời gian còn hiệu lực cho một trang là 20 phút. Cú pháp: Session.TimeOut [=number] Ví dụ: Thời gian hiệu lực mặc định là: Response.Write (Session.TimeOut) Thời gian hiệu lực bây giờ là: 4.3.3. Các phương thức của đối tượng Session Abandon Phương thcs Abandon dùng để kết thúc session của người dùng. Khi phương thức này được gọi, đối tượng Session hiện hành chưa bị xoá ngay mà sẽ tồn tại cho tới khi tất cả các Script của trang hiện h ành được xử lý xong. Điều này có nghĩa là bạn có thể truy cập các biến session trong cùng trang mặc dù bạn đã gọi phương thức Abandon trước đó, nhưng truy cập các biến session từ những trang khác th ì không được. Cú pháp: Session.Abandon Ví dụ: Tạo 2 tập tin file1.asp và tập tin file2.asp trong cùng một ứng dụng với nội dung sau: File1.asp 57
  59. File2.asp Khi người dùng yêu cầu trang file1.asp thì kết quả in ra màn hình là “Bill Gate” nhưng khi người dùng yêu cầu tiếp trang file2.asp thì kết quả không hiển thị Bill Gate như mong muốn bởi vì Session(“Ten”) đã bị kết thúc ở file1.asp do gọi phương thức Abandon. Contents.Remove Phương thức này dùng để xoá một phần tử ra khỏi tập Contents của đối t ượng Session. Cú pháp: Session.Contents.Remove (name | index) Khi gọi phương thức này ta có thể truyền vào tên của phần tử cần xoá hoặc vị trí của phần tử trong tập Contents. Ví dụ: ”) Dim x For each x in Session.Contents Response.Write (x & “=” & Session.Contents(x) & “ ”) Session.Contents.Remove(“ptu3”) Response.Write (“ Sau khi xoá ptu3: ”) For each x in Session.Contents Response.Write (x & “=” & Session.Contents(x) & “ ”) Session.Contents.Remove(2) Response.Write(“ Sau khi xoá ph ần tử thứ 2: ”) For each x in Session.Contents Response.Write (x & “=” & Session.Contents( x) & “ ”) %> Kết quả khi thực hiện trang này như sau: Contents.RemoveAll() 58
  60. Thay vì chỉ xoá một phần tử ta dùng phương thức Remove thì phương thức này chỉ xoá tất cả các phần tử ra khỏi tập Contents. Cú pháp: Session.Contents.RemoveAll() 4.3.4. Các sự kiện của đối tượng Session Session_OnStart Sự kiện này xuất hiện khi trình chủ tạo một session mới. Cài đặt của sự kiện này được đặt trong tập tin global.asa Session_OnEnd Sự kiện này xuất hiện khi session kết thúc. C ài đặt của sự kiện này cũng được đặt trong tập tin global.asa Chú ý: Trong cài đặt của sự kiện Session_OnEnd ta không sử dụng được phương thức MapPath vì ở đây phương thức này không còn hiệu lực. 4.4. Đối tượng Application Một ứng dụng bao gồm một tập hợp các file kết hợp với nhau để xử lý hoặc phục vụ cho một mục đích nào đó. ASP cung cấp một đối tượng dùng để kết hợp các file đó lại với nhau, đó là đối tượng Application. Đối tượng Application được dùng để lưu trữ các biến, qua đó các trang có thể truy cập đến các biến này. Không giống như đối tượng Session chỉ dùng cho một nối kết cho mỗi người dùng. Do đó đối tượng Application nên chứa các thông tin mà có thể được truy cập bởi nhiều trang trong ứng dụng (nh ư thông tin nối kết cơ sở dữ liệu, thông tin về số người dùng truy cập, ) nghĩa là bạn có thể truy cập các thông tin n ày từ bất cứ trang nào trong ứng dụng, nhưng chú ý là khi thay đổi các thông tin này sẽ ảnh hưởng đến tất cả các trang khác trong ứng dụng. 4.4.1. Tập hợp của đối tượng Application Contents Tập hợp Contents chứa tất cả các phần tử đã được gắn thêm vào đối tượng Application trong quá trình thực thi script. Cú pháp: Application.Contents(key) Trong đó key là tên của phần tử cần lấy. Ví dụ sau đây liệt kê tất cả các Application đã được dùng trong ứng dụng. Các biến Application trong tập Contents ”) Next %> StaticObjects 59
  61. Tập hợp StaticObject chứa tất cả các đối tượng được gắn vào ứng dụng với tag HTML . Cú pháp: Application.StaticObjects(key) Ví dụ: Đoạn code sau đây liệt kê tất cả các object ”) %> 4.4.2. Các phương thức của đối tượng Application Phương thức này dùng để xoá một phần tử ra khỏi tập Contents của đối t ượng Application Cú pháp: Application.Contents.Remove(name | index) Khi gọi phương thức này ta có thể truyền vào tên của phần tử cần xoá hoặc vị trí của phần tử trong tập Contents. Ví dụ: Contents.RemoveAll Thay vì chỉ xoá một phần tử ta dùng phương thức Remove thì phương thức này xoá tất cả các phần tử ra khỏi tập Contents. Cú pháp: Application.Contents.RemoveAll() Lock và Unlock Bởi vì tất cả các người dùng đều có thể truy cập đến các biến Application nên có thể cùng lúc 2 hay nhiều người dùng cùng thay đổi giá trị của biến và điều này đối tượng Application cung cấp hai phương thức Lock và Unlock. Phương thức Lock ngăn cản người dùng khác thay đổi biến trong đối tượng Application (dùng để đảm bảo rằng tại một thời điểm chỉ có một ng ười dùng thay đổi các biến trong đối tượng Application). Phương thức Unlock cho phép người dùng thay đổi giá trị các biến trong đối tượng Application. Cú pháp: Application.Lock Application.Unlock Lưu ý: Khi gọi phương thức Lock thì ta phải nhớ gọi phương thức Unlock ngay khi thực hiện xong. Ví dụ: <% Application.Lock 60