Bài giảng Lập trình mạng: Bài 1 - Đoàn Thiện Ngân

Chia sẻ: 5A4F5AFSDG 5A4F5AFSDG | Ngày: | Loại File: PDF | Số trang:35

Thêm vào BST

Báo xấu

60
lượt xem 3
download

Download Vui lòng tải xuống để xem tài liệu đầy đủ

Bài 1 giới thiệu về Internet – Web – HTML siêu liên kết – Danh sách – Bảng. Những nội dung trình bày trong chương này gồm có: Tổng quan ứng dụng web, HTML, CSS, XHTML, HTML 5,.... Mời các bạn cùng tham khảo.

Chủ đề:

Bình luận(0) Đăng nhập để gửi bình luận!

Lưu

Nội dung Text: Bài giảng Lập trình mạng: Bài 1 - Đoàn Thiện Ngân

Bài 1: Internet – Web – HTML Siêu liên kết – Danh sách – Bảng GV: ĐOÀN THIỆN NGÂN dngan2003@gmail.com – ngan@ueh.edu.vn LTM1 – Bài 1 - 1/35
Tài liệu tham khảo online 1. www.w3schools.com 2. http://www.htmlcodetutorial.com 3. http://www.javascriptkit.com 4. www.w3.org 5. HTML5 - WHATWQ www.whatwg.org JavaScript Web Applications, Alex MacCaw, O’Reilly, 2011 LTM1 – Bài 1 - 2/35
Phần 1: Tổng quan trang web tĩnh –Tổng quan ứng dụng web –HTML –CSS –Javascript –XHTML –HTML 5 LTM1 – Bài 1 - 3/35
Tổng quan • Phân loại tài liệu – WYWIWYG: What You Want Is What You Get. Groff, Troff, Tex, Latex, SGML, XML, HTML, … – WYSIWYG: What You See Is What You Get. Ms Word, … • HTTP ─ Hypertext Transfer Protocol – Web Server: IIS, Apache, Tomcat, Glassfish, Wamp. Xamm, … – Web Browser: IE (Internet Explorer), Firefox, Safari, Chrome, Opera, … LTM1 – Bài 1 - 4/35
HTML Editors • Dreamweaver (4, 8, CS3, CS4, CS5, CS6) • Microsoft – Frontpage 2003, – SharePoint Designer 2007, 2010 – WebMatrix – Expression Web 4 (free) • Free softwares: Kompozer, Aptana, SeaMonkey, Netbeans, … • CoffeeCup HTML Editor • PSPAD LTM1 – Bài 1 - 5/35
Tổng quan – Ứng dụng Web • Trang Web tĩnh: htm, html – Kết hợp client─side scripting (Javascript, Vbscript, …) – Không cần Web server lúc thử nghiệm – Hầu hết các trình duyệt hỗ trợ • Trang Web động (server─side scripting): rất đa dạng như cgi, asp, aspx, jsp, jsf, php, … – Thường đi với Cơ sở dữ liệu – Bắt buộc phải có web server - httpd lúc chạy để sinh HTML code trả về client LTM1 – Bài 1 - 6/35
Static Web pages Một vài nhận xét về trang web tĩnh: 1. Tác giả viết trang Web dùng HTML và lưu thành tập tin .htm (.html) trên Web server. 2. Sau đó một user nhập URL vào trình duyệt và một yêu cầu (request) được gởi từ trình duyệt đến Web server 3. Web server xác định trang .htm (hay .html) và chuyển nó về dạng HTML. 4. Web server gởi trang HTML qua mạng về trình duyệt. 5. Trình duyệt xử lý trang HTML và hiển thị lên trang web. LTM1 – Bài 1 - 7/35
Client─Side Scripting Web Pages Client-Side Scripting Web Pages 1. Tác giả viết một tập lệnh để tạo trang Web và lưu thành tập tin .htm trên Web server. Tập lệnh này có thể trong những dạng ngôn ngữ khác nhau và lưu riêng biệt hay chung trong tập tin HTML. 2. Sau đó một user nhập URL vào trình duyệt và một yêu cầu (request) được gởi từ trình duyệt đến Web server 3. Web server xác định trang .htm và những trang liên hệ chứa tập lệnh (nếu có) 4. Web server gởi trang HTML và tập lệnh tương ứng qua mạng về trình duyệt. 5. Trình duyệt xử lý trang HTML và tập lệnh hiển thị lên trang web. LTM1 – Bài 1 - 8/35
LTM1 – Bài 1 - 9/35
Server─Side Dynamic Web pages Server-Side Dynamic Web Pages 1. Tác giả viết một tập lệnh để tạo trang Web và lưu thành tập tin trên Web server. 2. Sau đó một user nhập URL vào trình duyệt và một yêu cầu (request) được gởi từ trình duyệt đến Web server 3. Web server xác định trang chứa tập lệnh 4. Web server xử lý tập lệnh tạo ra trang HTML 5. Web server gởi trang HTML qua mạng về trình duyệt. 6. Trình duyệt xử lý trang HTML và hiển thị lên trang web. asp; aspx; jsp; jsf; php;LTM1 cfm; … – Bài 1 - 10/35
LTM1 – Bài 1 - 11/35
HTML • Trang web tĩnh *.htm, *.html • Chạy thử trực tiếp trong trình duyệt, không cần web server • Tập tin văn bản với các thẻ lệnh quy chuẩn ─ WYWIWYG (Tools cho thấy định dạng WYSIWYG) • Cấu trúc, thẻ lệnh căn bản, định dạng, liên kết, bảng dữ liệu, frame, … (Chương 1, 2 và 3 giáo trình Lập trình mạng 1) LTM1 – Bài 1 - 12/35
CSS • Cascading Style Sheets ─ CSS • CSS định nghĩa cách hiển thị của các tài liệu viết bằng ngôn ngữ đánh dấu như HTML • CSS được thiết kế với mục đích tách biệt phần nội dung (viết bằng ngôn ngữ HTML) với phần trình bày (viết bằng ngôn ngữ CSS) của tài liệu • Sự tách biệt làm: – tăng khả năng truy xuất nội dung tài liệu, – tăng tính uyển chuyển và đơn giản cấu trúc – giảm bớt sự lặp lại các thẻ định dạng LTM1 – Bài 1 - 13/35
Sử dụng CSS trong HTML Ba cách sử dụng CSS • Inline CSS: – Bên trong một thẻ HTML • Internal CSS: – Trong phần đầu tài liệu HTML (head), nằm trong khối . • External CSS: – Trong tập tin riêng, có thể dùng chung cho nhiều trang HTML ─ tập tin *.css (Chương 4, 5 giáo trình Lập tình mạng 1) LTM1 – Bài 1 - 14/35
JavaScript • Ngôn ngữ kịch bản (Scripting language) • Không phải là ngôn ngữ Java • Tạo nội dung động (có thể thay đổi) cho trang web tĩnh (DHTML ─ Dynamic HTML) • Javascript là ngôn ngữ kịch bản ở phía client, chủ yếu được dùng để bổ sung tính tương tác cho Website: – kiểm tra dữ liệu nhập, – xử lý các biến cố xảy ra trên trang, … (chương 6, 7, 8 giáo trình Lập trình mạng 1) LTM1 – Bài 1 - 15/35
Sử dụng code Javascript • Trong trang web, đoạn mã HTML sử dụng được khai báo thông qua thẻ . 1. Chèn trực tiếp đoạn code Javascript vào giữa cặp thẻ … trong tập tin HTML. 2. Sử dụng tập tin Javascript riêng (*.js), và dùng thẻ để kết nối với trang HTML. LTM1 – Bài 1 - 16/35
XHTML • Trình duyệt có cách xử lý khác nhau • Cú pháp HTML lõng lẻo, trình duyệt này chạy nhưng trình duyệt khác không chạy. • XML (Extensible Markup Language) chặt chẻ và chính xác. • XML + HTML ≈ XHTML • XHTML đảm bảo chuẩn mực để các trình duyệt đều có thể chạy được. LTM1 – Bài 1 - 17/35
HTML 5 • Giới hạn của HTML 4 (1998). • W3C: XHTML 1.0 (1998), 1.1 (2000─2004) 2.0 (2006─2009) ? • HTML5 (2009): WHATWG (Web Hypertext Application Technology Working Group, www.whatwg.org) mở rộng HTML 4, đưa vào nhiều tag mới, nhiều khái niệm mới. • Chú ý: Nhiều trình duyệt chưa hỗ trợ tất cả các tính năng mới của HTML5. LTM1 – Bài 1 - 18/35
Phần 2 THẺ HTML – HTML TAGS LTM1 – Bài 1 - 19/35
Nội dung • Chương 1: Internet – Web – HTML – Internet – Web – HTML • Chương 2: Siêu liên kết – Danh sách – Bảng – Siêu liên kết – Danh sách – Bảng LTM1 – Bài 1 - 20/35