Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống
1
/ 201 trang
THÔNG TIN TÀI LIỆU
Thông tin cơ bản
Định dạng
Số trang
201
Dung lượng
6,98 MB
Nội dung
TRƯỜNG ĐẠI HỌC ĐÀ LẠT KHOA CÔNG NGHỆ THÔNG TIN Thạc sỹ Hoàng Mạnh Hùng BÀI GIẢNG TÓM TẮT LẬP TRÌNH WEB Dành cho sinh viên ngành Cao Đẳng (Lưu hành nội bộ) Đà Lạt 2008 MỤC LỤC M Ụ C L ỤC 1 CHƯƠNG 1: GI Ớ I THI Ệ U HTML – CÁC SIÊU LIÊN K Ế T 4 1.3.1 HTML Development 6 1.3.2 C ấ u trúc c ủ a m ộ t tài li ệu HTML 7 1.3.3 S ử d ụ ng th ẻ <META> 10 1.3.4 S ử d ụ ng ký t ự đặc biệt trong tài li ệu HTML 10 1.4.1 Gi ớ i thiệu siêu liên kết và URL 12 1.4.2 S ử d ụ ng siêu liên kết 14 1.4.3 Đ iều h ướ ng quanh Web site 19 CHƯƠ NG 2: CÁC TH Ẻ HTML C Ơ B Ả N 22 ! " #$%& #'% 2.6.1 Danh sách không thứ t ự 25 2.6.2 Danh sách có thứ t ự 28 ! ! () * #% + ,- . / 0 1 2 3 - / CHƯƠ NG 3: S Ử D Ụ NG B ẢNG 40 4 5- 63 4 3.2.1 Thẻ dùng để t ạ o b ảng 40 3.2.2 Chèn hàng và c ột 43 3.2.3 Xoá hàng và c ột 44 3.2.4 Tr ộ n ô: kết h ợ p c ộ t hay dòng 45 3.2.5 Đị nh d ạ ng cho ô 48 7 '/- / 4 3.4.1 Chèn ảnh động (.GIF) vào tài li ệu HTML 50 3.4.2 Chèn âm thanh vào tài li ệu HTML 51 3.4.3 Chèn video vào tài li ệu HTML 53 CHƯƠ NG 4: S Ử D Ụ NG BI Ể U M Ẫ U VÀ KHUNG 54 68 9 4.2.1 S ử d ụng biểu m ẫu 54 4.2.2 Phầ n t ử FORM 55 4.2.3 Các ph ầ n t ử nh ậ p c ủ a HTML 56 4.2.4 T ạ o biểu m ẫu 66 , +: ;< =>?@A BCD 4.3.1 T ạ i sao s ử d ụ ng khung? 70 4.3.2 S ử d ụ ng khung 70 4.3.3 Phầ n t ử IFRAME – Khung trên dòng (inline frame) 76 CHƯƠ NG 5: S Ử D Ụ NG STYLE 78 .1 .1 5.2.1 Gi ớ i thiệu DHTML 78 5.2.2 Các đặc đ iểm c ủ a DHML 79 E 14 5.3.1 Khái niệm, chứ c n ăng và l ợ i ích c ủ a Style Sheets 80 5.3.2 Quy t ắ c Style Sheets 83 5.3.3 Các Selector trong Style Sheets 85 5.3.4 Kết h ợ p, liên kết và chèn m ộ t Style Sheet vào tài li ệu HTML 91 5.3.5 Thiết l ậ p thu ộ c tính trong Style Sheet 93 CHƯƠ NG 6: JAVASCRIPT, N Ề N T ẢNG VÀ CÚ PHÁP 95 + : + ' F'$ : 6.2.1 Javascript là gì? 95 6.2.2 Hiệu ứng và quy t ắ c Javascript 96 6.2.3 Các công c ụ Javascript và IDE, môi tr ườ ng thự c thi 97 6.2.4 Nhúng Javascript vào trang Web 97 6.2.5 Ví d ụ đơ n gi ả n s ử d ụ ng h ộ p thông báo và phươ ng thứ c write 103 + 6 4 6.3.1 Khai báo biến 104 6.3.2 Ph ạ m vi c ủ a biến 104 + 8 G 4 Ý ngh ĩa 108 + - 4: 6.5.1 Toán t ử s ố h ọc 110 6.5.2 Toán t ử so sánh 111 6.5.3 Toán t ử logic 112 6.5.4 Toán t ử chu ỗ i 113 6.5.4 Toán t ử Evaluation 113 6.5.5 M ứ c ư u tiên c ủ a các toán t ử 115 ++ 3 +. H 4 +1 'I J$ +: / ,- CHƯƠ NG 7: CÁC ĐỐ I T ƯỢ NG C Ơ B Ả N TRONG JAVASCRIPT 129 . : . " (K F'$ : 7.2.1 Câu lệnh This 130 7.2.2 Đố i t ượ ng String 132 7.2.3 Đố i t ượ ng Math 134 7.2.4 Đố i t ượ ng Date 137 ;< =>?@A BCD . " (K ' L . M F'$ . 2 N O M 4 TÀI LI Ệ U THAM KH ẢO 153 ;< =>?@A BCD CHƯƠNG 1: GIỚI THIỆU HTML – CÁC SIÊU LIÊN KẾT P= =AQR RAST@U @VW& DX@ RY =AZ* [ =\ ]^ @=C>@C= [ =\ ]^ '_P= `a= =V_ b_cd eT@ U_\@ f gh@U i_jd b_j@ kP= =>l@U =V_ b_cd f gh@U =Am #% f gh@U RnR ko =p eqR D_c= =>l@U =V_ b_cd 1.1 GIỚI THIỆU r@=C>@C=s&rBl>bg B_gC BCDs& ]V rBCD <tUCs kA[@U RAu Rv@ bV RnR =Ad;= @Uw _x eyW& RnR =Ad;= @Uw @VW ez =>{ =AV@A A_c@ =ApR @=C>@C= bV `X@U `nW =|@A b} @ @A~= =>j@ =AP U_}_& eS•R €C` @AS bV `X@U R•t RnR `X@U Bl>bg B_gC BCD bV `a= =; < Rl@ R•t @=C>@C= Bl>bg B_gC BCD U‚` RnR BCD C>]C>i RY `q= kAƒ< `„_ @T_ =>j @ =AP U_}_ nR BCD iC>]C> RA…t =A[@U =_@ `V D~= k† @USx_ g‡@U @Vl =>j@ =AP U_}_ R ˆ@U RY =AZ =>dW R;< eS•R nR =A[@U =_@ eY eS•R bSd =>w gS}_ gX@U RnR =>t@U BCD >l@U <A‰@ @VW& RAQ@U =t iŠ A„R ]^ U[@ @Uw en@A g~d i_jd ]‹@ D\@ & eyW bV `a= <A‰@ Œdt@ =>„@U =>l@U bz@A ]pR =A_P= kP ]V <An= =>_Z@ =AP U_}_ BCD 1.2 GIỚI THIỆU INTERNET X@U bV `a= @AY` RnR `nW =|@A kP= @•_ ]}_ @Atd @=C>@C= bV `X@U R•t RnR `X@U _tl =A…R $Ž$ >t@i`_ii_l@ l@=>lb $>l=lRlbŽ@=C>@C= $>l=lRlb Rd@U R~ < ]_cR kP= @•_ =~= R\ RnR `nW =|@A =>j@ =AP U_}_ Hình 1.1: Internet Bl>bg B_gC BCD bV `a= =;< Rl@ R•t @=C>@C= Y Dƒ= e‰d @AS bV e^ n@ @UA_j @ R…d R~< Œd•R U_t =X_ <Av@U @UA_j@ R…d { AhW • UVW @tW& @Y Rd@U R~< =A[ @U =_@ RAl @USx_ g‡@U =>j@ =lV@ =AP U_}_ BBB AlX= ea@U gpt =>j@ RT RAP eZ eSt RnR =V_ @UdWj@ RY U_n =>• eP@ ]}_ @USx_ g‡@U Y bV* ;< =>?@A BCD _tl =A…R* USx_ g‡@U =dy@ =ACl RnR U_tl =A…R @VW eZ =>dW R;< =V_ @ UdWj@ =>j@ BCD W<C>C€= >t@i‘C> $>l=lRlb$ bV U_tl =A…R eS•R BBB i f gh@U •t RAu* BBB =dy@ =ACl `a= RnRA =A…R eq= =j@ =A•@U @A~= eZ =>dW R ;< ]Vl RnR =V_ @UdWj@ =>j@ BCD eS•R if gh@U eZ @A;@ gX@U RnR =>t@U ]V RnR =V_ @UdWj@ =>j@ BCD * U[@ @Uw en@A g~d i_jd ]‹@ D\@ eS•R if gh@U eZ =Xl RnR =V_ b_cd RY =AZ =>dW R;< =>j@ BCD V_ b_cd eS•R =Xl >t D’@U RnR A if gh@U RnR =Am ]V RnR <A‰@ =f R•t ,_bC eS•R bSd =>j@ BCD iC>]C> ]}_ ed[_ A=` AlqR A=`b A_ DX@ if gh@U =>?@A gdWc= eZ Wjd R‰d `a= i• =A[@U =_@ @Vl eY& BCD iC> ]C> iŠ en< …@U RnR Wjd R‰d eY Y Uf_ =A[@U =_@ eS•R Wjd R‰d eP@ =>?@A gdWc= gS}_ gX@U RnR =>t@U “CD >?@A gdWc= e•@A gX@U =A[@U =_@ gl `nW RA• Uf_ ]^ ]V A_Z@ =A_ RA Q@U Hình 1.2: Trình duyệt yêu cầu đến máy chủ 1.3 GIỚI THIỆU HTML U[@ @Uw en@A g~d i_jd ]‹@ D\@ RAu >” `a= =>t@U BCD eS•R A_Z@ =A• @AS =AP @Vl =>l@U `a= =>?@A gdWc= f gh@U RnR =Am ]V RnR <A‰@ =f & DX@ RY =AZ* _^d kA_Z@ A?@A =A…R ]V @a_ gd@U R•t =>t@U Nd~= D\@ RnR =V_ b_cd =>pR =dWP@ ]V =>dW €d~= =A[@U =_@ =>pR =dWP@ D’ @U RnRA if gh@U RnR b_j@ kP= eS•R RA•@ ]Vl =V_ b_cd Xl RnR D_Zd `–d =>pR =dWP@ eZ =Ad =A;< =A[@U =_@ ]^ @USx_ g‡@U& Œ d\@ bo RnR [...]... Trình duyệt thông dịch những lệnh này và hiển thị trang web như hình 1.3 Hình 1.3: Kết quả ví dụ 1 1.3.1 HTML Development Tài liệu HTML được hiển thị trên trình duyệt Vậy trình duyệt là gì ? Trìn h duyệt là một ứng dụng được cài đặt trên máy khách Trình duyệt đọc mã nguồn HT ML và hiển thị trang theo các lệnh trong đó Trình duyệt được sử dụng để xem các trang Web và điều hướng .Trình duyệt... máy tính quốc gia (NCSA) Ngày nay, có nhiều trình duyệt được sử dụng trên Internet Netscape’s Navigator và Microsoft’s Internet Explorer là hai trình duyệt được sử dụng phổ biến Đối với người dùng, trình duyệt dễ sử dụng bởi vì nó có giao diện đồ họa v ới việc trỏ và kích chuột Để tạo một tài liệu nguồn,bạn phải cần một trình soạn thảo HTML Ngày nay , có nhiều trình soạn thảo đang được sử dụng: Microsoft... trình tự liên tiếp nhau Hình 1.16: Trình bày tuyến tính Trình bày theo phân cấp: Đây là cách trình bày thông thường nhất được sử dụng trong thiết kế Web Trang chủ liên kết với nhiều trang khác Người d ùng có thể chọn một liên kết và “nhảy” đến trang cần đến Mỗi trang đều có liên k ết về trang chủ Hình 1.17: Trình bày theo phân cấp Bản đồ ảnh – Một số người thấy cách trình bày trực quan thì dễ hiểu hơ... xem được tài liệu trên trình duyệt bạn phải lưu nó với đuôi là htm hay html Các lệnh HTML được gọi là các thẻ Các thẻ này được dùng để điều khiển n ội dung và hình thức trình bày của tài liệu HTML Thẻ mở (“”) và thẻ đóng (“”) , chỉ ra sự bắt đầu và kết thúc của một lệnh HTML Ví dụ, thẻ HTML được sử dụng để đánh dấu sự bắt đầu và kết thúc của tài liệ u HTML 6 Lập trình Web Chú... dùng, ta sử dụng vạch dấu (marker) trong thông số HREF như sau Topic name 16 Lập trình Web Dấu # ở trước tên của siêu liên kết để báo cho trình duyệt biết rằng liên kết n ày liên kết đến một điểm được đặt tên trong tài liệu Khi không có tài liệu nào được c hỉ ra trước ký tự #, trình duyệt hiểu rằng liên kết này nằm trong cùng tài liệu Ví dụ 8: Using Links... một web site Trình bày tuyến tính – Cách này theo cấu trúc tuyến tính Có một chuỗ i liên kết liên tục giữa các trang Mỗi trang có liên kết đến trang trước và trang s au Trang cuối có liên kết đến trang đầu Định dạng này được dùng khi chúng ta muốn trình bày thông tin liên tục Ví dụ, các chương trong cuốn sách hoặc các slid e của một bài trình bày mà yêu cầu người dùng đọc thông tin theo trình tự liên... nguồn của trang Web Khi được xem trên trình soạn thảo, tài liệu này là một chuỗi các thẻ và các phần tử, mà chúng xác định trang web hiển thị như thế nào Trình duyệt đọc các file có đuôi htm hay html và hiể n thị trang web đó theo các lệnh có trong đó Ví dụ, theo cú pháp HTML dưới đây sẽ hiển thị thông điệp “My fir st HTML document” Ví dụ 1: 5 Lập trình Web Welcome to HTML... được nằm trong cặp thẻ … Mỗi mục trong danh sách được đánh dấu bằng thẻ LI được viết tắt của từ List Item Thẻ kết thúc là tùy chọn (không bắt buộc) Ví dụ 6: Learning HTML Monday Tuesday Wednesday Thursday Friday 25 Lập trình Web Hình 2.6: Kết quả ví dụ 6 Chúng ta có thể tạo ra các danh sách lồng... 17 Lập trình Web Hình 1.12: Kết quả ví dụ 8 Hình 1.13: Kết quả ví dụ 8 sau khi kích vào Internet Liên kết đến một điểm xác định ở một tài liệu khác Bây giờ chúng ta đã biết cách sử dụng các vạch dấu trong cùng một tài liệ u, hãy thử “nhảy” đến một vị trí trên một tài liệu khác Để “nhảy” đến một điểm trên tài liệu khác, chúng ta cần phải chỉ ra tên của t ài liệu khi chúng ta tạo vạch dấu Trước tiên trình. .. muốn người sử dụng gửi được e-mail, chúng ta có thể đưa một đặc tính vào trong trang Web và cho phép họ gửi e-mail từ trình duyệt Tất cả những gì chúng ta cần làm là chèn giá trị mailto vào trong thẻ liên kết 1.4.3 Điều hướng quanh Web site 19 Lập trình Web Dù web site có lôi cuốn đến đâu, nếu nó không có một lược đồ điều hướng đơn giản thì người dùng cũng sẽ mất . ĐÀ LẠT KHOA CÔNG NGHỆ THÔNG TIN Thạc sỹ Hoàng Mạnh Hùng BÀI GIẢNG TÓM TẮT LẬP TRÌNH WEB Dành cho sinh viên ngành Cao Đẳng (Lưu hành nội bộ) Đà Lạt . RnR =>t@U “CD >?@A gdWc= e•@A gX@U =A[@U =_@ gl `nW RA• Uf_ ]^ ]V A_Z@ =A_ RA Q@U Hình 1.2: Trình duyệt yêu cầu đến máy chủ 1.3 GIỚI THIỆU HTML U[@ @Uw en@A g~d i_jd ]‹@