Đề cương bài giảng môn học Lập trình mạng pdf

TRƯỜNG ĐẠI HOC SƯ PHẠM KỸ THUẬT VINH
KHOA CÔNG NGHỆ THÔNG TIN
ĐỀ CƯƠNG BÀI GIẢNG
MÔN HỌC LẬP TRÌNH MẠNG
NĂM 2009
1
1. SOẠN THẢO SIÊU VĂN BẢN 7
Download PHP 114
Download MySQL Database 114
Download Apache Server 114
2
CHƯƠNG I- MỞ ĐẦU
I. Mục tiêu của môn học
• Nắm vững các khái niệm căn bản của quá trình thiết kế, cài đặt và triển
khai một ứng dụng web
• Sinh viên nắm được những kiến thức cơ bản nhất về thiết kế trang web tĩnh,
như ngôn ngữ HTML VBScript, JavaScript,
• Lập trình web động với công nghệ ASP, PHP
• Thực hành xây dựng ứng dụng web hoàn chỉnh có khả năng tương tác với
CSDL (MS Access, MS SQL, MySQL…)
II. Yêu cầu về kiến thức
• Visual Basic 6.0, VBA
• Căn bản về CSDL
• Kiến thức về MS Access và MS SQL Server / My SQL, MySQL
III. Tài liệu tham khảo
• Công nghệ Internet/Intranet, T.Quang Thanh, Khoa CNTT – ĐHSPKT
Vinh
• Slice Bài giảng Lập trình Mạng
• Trang web tham khảo
•
• />•

•
IV. Mở đầu về thiết kế web
• Nhắc lại một số khái niệm
• Phân loại trang web
• Một số bước chính trong phát triển website
• Công bố website trên internet
• Một số nguyên tắc quan trọng trong thiết kế web
• Cấu trúc website và bố cục trang web
• Tiếng Việt trong trang web
IV.1. Nhắc lại một số khái niệm
4.1.1. Mạng, giao thức mạng
 Mạng máy tính: Computer Network: Hệ thống các máy tính được kết nối
với nhau nhằm trao đổi dữ liệu.
 Giao thức: Protocol:
– Tập hợp các quy tắc được thống nhất giữa các máy tính trong mạng
nhằm thực hiện trao đổi dữ liệu được chính xác
– Ví dụ: TCP/IP, HTTP, FTP,…
4.1.2. Địa chỉ IP
3
• Xác định một máy tính trong mạng dựa trên giao thức TCP/IP. Hai máy
tính trong mạng có 2 địa chỉ IP khác nhau
• Có dạng x.y.z.t (0 ≤ x, y, z, t ≤ 255)
• Ví dụ: 203.162.01.11
• Đặc biệt: địa chỉ: 127.0.0.1 (địa chỉ loopback) là địa chỉ của chính máy tính
đang sử dụng dùng để thử mạng
4.1.3. Tên miền (domain)
• Là tên được “gắn” với 1 địa chỉ IP.
• Máy chủ DNS thực hiện việc “gắn” (ánh xạ)
• Ở dạng văn bản nên thân thiện với con người
• Được chia thành nhiều cấp, phân biệt bởi dấu chấm (.).

• Cấp lớn hơn là con của cấp nhỏ hơn
• Ví dụ: cntt.spktvinh.edu.vn gắn với 203.162.01.11 trong đó:
• vn: Nước Việt Nam (Cấp 1)
• edu: Tổ chức giáo dục (Cấp 2)
• Spktvinh : Tên cơ quan (Cấp 3)
• cntt: đơn vị nhỏ trong cơ quan (Cấp 4)
• Đặc biệt: Tên localhost được gắn với 127.0.0.1
4.1.4. Máy chủ (SERVER)
• Là máy tính chuyên cung cấp tài nguyên, dịch vụ cho máy tính khác.
• Thường được cài các phần mềm chuyên dụng để có khả năng cung cấp
• Một máy chủ có thể dùng cho một hay nhiều mục đích. Tên máy chủ
thường gắn với mục đích sử dụng. Ví dụ:
• File server
• Application server
• Mail server
• Web server
• Thực tế: các máy chủ có cấu hình cao, khả năng hoạt động ổn định
4.1.5. Máy khách (client)
• Máy khai thác dịch vụ của máy chủ
• Với mỗi dịch vụ, thường có các phần mềm chuyên biệt để khai thác
• Một máy tính có thể vừa là client vừa là server
• Một máy tính có thể khai thác dịch vụ của chính nó.
4.1.6. Cổng dịch vụ (Service Port)
• Là số ∈ [0; 65535] xác định dịch vụ của máy chủ
• 2 dịch vụ khác nhau chiếm các cổng khác nhau
• Mỗi dịch vụ thường chiếm các cổng xác định, ví dụ:
• Web: 80
• FTP: 21
…
4.1.7. Chuỗi định vị tài nguyên (địa chỉ): URL (Uniform Resource Location)

4
• Tài nguyên: file trên mạng
• URL: (Uniform Resource Location) Bộ định vị tài nguyên thống nhất
• Cấu trúc:
• giao_thức://địa_chỉ_máy:cổng/đường_dẫn/tên_file
• Ví dụ: :8080/html/test.htm
• Trong trường hợp mặc định, nhiều thành phần có thể bỏ qua:
• Giao thức, cổng: Được trình duyệt đặt mặc định
• Tên file: được máy chủ đặt mặc định
4.1.8.Trang web, web site, World Wide Web
• Trang web: Web page: Là một trang nội dung Có thể được viết bằng nhiều
ngôn ngữ khác nhau nhưng kết quả trả về client là HTML
• Web site: Tập hợp các trang web có nội dung thống nhất phục vụ cho một
mục đích nào đó
• World Wide Web (WWW): Tập hợp các web site trên mạng internet.
4.1.9. Web server, Web browser
• Web server: là phần mềm chạy trên máy chủ để phục vụ
• Một số phần mềm web server chuyên dụng:
o Apache: mã nguồn mở
o Internet Information Services (IIS): Sản phẩm của Microsoft
• Web Browser: Phần mềm chạy trên client để khai thác dịch vụ web
• Một số Web browser:
o Nescape
o Mozilla Firefox
o Internet Explorer (IE): tích hợp sẵn trong windows
o
4.2. Phân loại web
• Dựa vào công nghệ phát triển, có 2 loại:
• Web tĩnh: là các trang web được xây dựng sẵn trên Server có hình dáng
nguyên thuỷ như thế nào thì khi thể hiện trên browser nó thể hiện nguyên si

như vậy
o Dễ phát triển
o Tương tác yếu
o Sử dụng HTML
o Người làm web tĩnh thường dùng các công cụ trực quan để tạo ra
trang web
• Web động:có khả năng tương tác với cơ sở dữ liệu đặt trên Server
o Khó phát triển hơn
o Tương tác mạnh
o Sử dụng nhiều ngôn ngữ khác nhau
o Thường phải viết nhiều mã lệnh
5
4.3. Các bước phát triển trang web
• Tương tự với phân tích và thiết kế hệ thống.
o Đặc tả
o Phân tích
o Thiết kế
o Lập trình
o Kiểm thử
• Đặc tả:
o Web để làm gì?
o Ai dùng?
o Trình độ người dùng?
o Nội dung, hình ảnh?
• Phân tích
o Mối liên quan giữa các nội dung?
o Thứ tự các nội dung?
o
• Thiết kế
o Sơ đồ cấu trúc website

o Giao diện
o Tĩnh hay động
o CSDL
o Nội dung từng trang
o Liên kết giữa các trang
• Xây dựng
o Cấu trúc thư mục
o Các modul dùng chung
o …
• Kiểm thử
o Kiểm tra trên nhiều trình duyệt
o Kiểm tra trên nhiều loại mạng
o Kiểm tra tốc độ
o Kiểm tra các liên kết
o Thử các lỗi bảo mật
o …
6
CHƯƠNG 2 NGÔN NGỮ ĐÁNH DẤU SIÊU VĂN BẢN HTML
(HYPERTEXT MARKUP LANGUAGE)
1. SOẠN THẢO SIÊU VĂN BẢN
1.1. Trang mã nguồn HTML và trang Web
Trang mã nguồn HTML là một tệp văn bản bình thường gồm các kí tự
ASCII, có thể được tạo ra bằng bất cứ bộ soạn thảo văn bản nào. Theo qui ước, tất
cả các tệp mã nguồn của siêu văn bản phải có đuôi là .html hoặc .htm.
Khi dùng trình duyệt (brower) đọc nội dung trang mã nguồn và hiển trị nó
lên màn hình máy tính thì ta thường gọi là trang Web. Vậy trang Web không tồn
tại trên đĩa cứng của máy tính. Nó là cái thể hiện của trang mã nguồn qua xử lý
của trình duyệt
Hiện nay có nhiều công cụ soạn thảo siêu văn bản mạnh như MicroSoft
Word 97, FrontPage 2000 , Visual InterDev 6.0 . . . với giao diện trực quan và tự

động sinh mã HTML, cho phép soạn thảo siêu văn bản không khác gì so với soạn
thảo thông thường.
Tuy nhiên, việc tìm hiểu cú pháp của HTML, nắm vững ý nghĩa các thẻ khác
nhau vẫn rất cần thiết để có thể tạo ra các trang Web sinh động, tương tác với các
ứng dụng cơ sở dữ liệu sau này.
1.2. Các thẻ HTML là gì?
Các thẻ (Tag) dùng để báo cho trình duyệt cách thức trình bày văn bản trên
màn hình hoặc dùng để chèn một mối liên kết đến các trang khác, một đoạn
chương trình khác . . . Mỗi thẻ gồm từ khoá (KEYWORD) bao bọc bởi 2 dấu “<”
và “>” . Hầu hết các lệnh được thể hiện bằng một cặp hai thẻ: thẻ mở
(<KEYWORD>) và thẻ đóng (</KEYWORD>).
<KEYWORD> Đoạn văn chịu sự tác động của lệnh </KEYWORD>
Nhiều thẻ có kèm các thuộc tính bắt buộc hay không bắt buộc, cung cấp thêm
các tham số chi tiết hơn cho việc thực hiện lệnh.
1.3. Vài qui tắc chung
a/ Nhiều dấu cách liền nhau cũng chỉ có tác dụng như một dấu. Bạn phải
sử dụng thẻ để thể hiện nhiều dấu dãn cách liền nhau.
b/ Các từ khoá không phân biệt chữ hoa và chữ thường
7
c/ Qui tắc viết các kí tự đặc biệt trong HTML là tên_qui_định của kí tự
nằm giữa dấu & và dấu nháy kép “.
Các viết: & tên_qui_định “
d/ Có thể chèn các dòng chú thích vào trang mã nguồn bằng cách đặt giữa
cặp dấu chú thích <! và >. Trình duyệt sẽ bỏ qua không xem xét
đến phần mã nằm giữa cặp dấu đó.
<! - - dòng chú thích >
1.4. Cấu trúc của một tài liệu HTML
Mọi tài liệu HTML đều có khung cấu trúc như sau:
Giữa cặp thẻ tiêu đề <TITLE> . . . </TITLE> là dòng chữ sẽ hiện lên trên
thanh tiêu đề của cửa sổ khi trình duyệt đọc tài liệu. Nếu bỏ trống thì trình duyệt

sẽ cho hiện tên tệp thay vào đó.
Toàn bộ nội dung của tài liệu nằm giữa hai thẻ xác định thân của trang
<BODY> . . . </BODY>. Các dòng văn bản, hình ảnh , âm thanh , video , các mối
liên kết . . . tạo nên trang Web đều phải nằm ở đây.
Ví dụ: trang web hiển thị lên màn hình trình duyệt dòng “Hello World !!!”
Nội dung chương trình:
<HTML>
<HEAD>
<TITLE>Vi dụ về trang Hello World</TITLE>
</HEAD>
<BODY>
Hello World !!!
<Hr>
</BODY>
</HTML>
2. TRÌNH BÀY TRANG TRONG HTML
2.1. Các mức đầu đề trong HTML
8
<HTML>
<HEAD><TITLE> . . .</TITLE></HEAD>
<BODY>
. . . . .
</BODY>
</HTML>
Mở đầu trang văn bản là đầu đề cần làm nổi bật. Các phần của văn bản như
chương, tiết , mục . . .
Các thẻ định nghĩa đầu đề là <Hn> và </Hn> (Tag Header). Trong bộ thẻ
này có thêm tính chất "Align" dùng để căn lề các mức đầu đề, có các giá trị:
_ "Left": dùng căn lề trái cho dòng tiêu đề.
_ "Right": dùng căn lề phải cho dòng tiêu đề.

_ "Center": dùng để đưa dòng tiêu đề vào giữa.
_"Justify": dùng để sắp xếp đầu đề trên một dòng văn bản.
Đầu đề này có sáu cỡ văn bản: Từ H1 đến H6, kiểu H1 là kiểu to nhất và
giảm dần đến H6 là kiểu nhỏ nhất. Ví dụ: để có dòng tiêu đề với cỡ chữ là to nhất
ta dùng cú pháp: <H1 align=”center”>Truong CDSPKT Vinh </H1>.
2.2. Các thẻ trình bày trang trong HTML
• Thẻ <P> và </P> (paragraph): dùng để phân các khối văn bản bằng một
dòng trống trước khi nó tiếp tục, kèm theo bộ thẻ này nó có tính chất
"Align" với 4 giá trị
_ "Left": Browser sẽ đặt đoạn văn bản tiếp theo về phía bên trái.
_"Right": Browser sẽ đặt đoạn văn bản tiếp theo về phía bên phải.
_"Center": Browser sẽ đặt đoạn văn bản tiếp theo vào giữa trang.
_"Justify": Browser sẽ đặt đoạn văn bản tiếp theo trên một hàng.
Thuộc tính ngầm định là "Left".
Ví dụ:
<P align=”Justify>
nội dung của đoạn văn
</P>
Các thẻ của khối văn bản:
Để thêm vào một vài kiểu định dạng theo ý tác giả, HTML đã đưa vào một số
thẻ sau:
• Thẻ <Blockquote> và </Blockquote>: hoặc viết ngắn gọn <BQ> và
</BQ>, bộ thẻ này giống như bộ thẻ paragraph. Thay vì bộ thẻ paragraph
thêm vào dòng trống trước đoạn văn bản, thì bộ thẻ Blockquote này nó
thêm vào cả trước, sau, trái, phải của tài liệu và có thể hiển thị một dạng
font khác.
• Thẻ <ADDRESS> và </ADDRESS>: Đây là thẻ địa chỉ nó cho khối văn
bản nằm trong thẻ này có một dạng định dạng khác. Thường bộ thẻ này
nằm cuối của tài liệu, dùng để ghi lại địa chỉ của E_mail hoặc các biệt hiệu
9

của tác giả.
• Thẻ <BR> và </BR>: Thường được dùng trong các trường hợp giống như
khối địa chỉ khi cần ghi trên những dòng khác nhau, thẻ này có thể được
dùng để ngắt trong một dòng văn bản mà không cần chèn các dòng trống.
• Thẻ <PRE> và </PRE>: Đây là thẻ định dạng cho đoạn văn bản. Trong thẻ
này kèm theo thuộc tính "Width=n". Giá trị mặc định là 80 kí tự. Trong
đoạn thẻ này có thể sử dụng các kí tự ASCII nghệ thuật. Như vậy ta có thể
sử dụng <PRE> để lập các bảng.
• Thẻ <hr> : (hr_horizontal Rule) sẽ cho đường kẻ ngang chạy suốt cửa sổ
màn hình. Thẻ này có tính chất là:
- Width=n%: thay đổi độ dài đường kẻ , chiếm n% độ rộng màn hình
- Size=n: thay đổi độ đậm hay mảnh của đường kẻ. N là số pixel
- Align=”Left | Center | Right” căn trái, căn giữa hay căn phải đường kẻ
Ví dụ: <HR Width=80% align=”left” size=2>
3. TRÌNH BÀY KIỂU CHỮ
3.1. Các thẻ trình bày chữ
• Thẻ <Strong> và </Strong> hoặc <B> và </B>: In chữ đậm
• Thẻ <EM> và </EM> hoặc <I> và </I>: in chữ nghiêng
• Thẻ <U> và </U>: in chữ gạch chân
• Thẻ <Sup> và </Sup>:
in chỉ số trên
• Thẻ <Sub> và </Sub>:
in chỉ số dưới
3.2. Các thuộc tính của Font chữ
Cặp thẻ <FONT> . . . </FONT> cho phép thay đổi kiểu, màu và kích thước
của chữ.
• Thuộc tính SIZE: thay đổi kích thước của chữ, bạn có thể chọn tập kích
thước từ 1 đến 7 hoặc dùng SIZE=+/-n , trong đó +/-n chỉ ra mức thay đổi bạn
muốn.
Ví dụ: <FONT size=+1> . . . </FONT>

• Thuộc tính COLOR: thuộc tính này xác định màu chữ đè lên màu chữ được
đặt bởi thẻ <BODY>
Ví dụ: <FONT Color=”#rrggbb”> . . . </FONT>
• Thuộc tính FACE: cho phép xác định kiểu chữ
Ví dụ: <FONT face=”.VnTime”> . . . </FONT>
• Phối hợp các thuộc tính:
10
Ví dụ: <FONT size=+1 face=”.VnTime” color=”#rrggbb”> . . .
</FONT>
4. DANH SÁCH VÀ BẢNG TRONG HTML
4.1. Danh sách
a. Thẻ <UL> và </UL> (Unordered List): là bộ thẻ danh sách không thứ tự, nó
có dạng:
<UL>
<LI> . . .first list Item
<LI> . . .second list Item
</UL>
Trong đó <LI> có các thuộc tính sau, xác định kiểu hạt đậu ở đầu dòng: “disc”,
“square” hoặc “circle”.
Ví dụ:
<UL>
<LI type=disc>Phần một
<LI type=square>Phần hai
<LI type=circle>Phần ba
</UL>
b. Thẻ <OL> và </OL> (Ordered List): là thẻ chứa một danh sách thứ tự. Phần
nhiều là giống như một danh sách không thứ tự, nhưng nó thay nút đầu bằng
những con số được sử dụng một cách tự động và tăng dần với mỗi phần tử.
Trong đó <LH> và </LH> là đầu danh sách.
Ví dụ:

<OL>
<LH>Danh sách</LH>
<LI>Phần một
<LI>Phần hai
<LI>Phần ba
</OL>
4.2. Trình bày bảng trong HTML
Bạn có thể tạo ra bảng biểu sử dụng các thẻ sau đây:
TAG/Attribute Description
<TABLE BORDER=n
CELLSPACING=n
- TABLE - là bắt đầu bảng
- BORDER - đặt khung nổi bao quanh các ô
11
CELLPADDING=n
BGCOLOR=”#rrggbb”>
- CELLSPACING - dùng để đặt khoảng
cách giữa các ô trong bảng
- CELLPADDING - Dùng để định khoảng
cách trong ô với các đường bao
- GBCOLOR - đặt màu nền trong bảng
<CAPTION>
</CAPTION>
- dùng để đặt tựa đề cho bảng
<TR> . . .</TR> Dùng để chèn một dòng trống vào bảng đồng
thời dùng để báo cho browser biết dữ liệu là
dữ liệu cuối để kết thúc dòng này.
<TD> . . .</TD> - Dùng để đặt dữ liệu cho mỗi ô.
<TH> </TH> - Dùng cho ô ở phần đầu của dòng hoặc cột,
cho phép hiển thị dòng văn bản mới với font

chữ đậm để làm tiêu đề cho cột hoặc dòng đó.
ALIGN="Left, Right, Center" - Dùng để căn lề theo chiều ngang của ô.
Thuộc tính này dùng kèm bên các thẻ <TR>,
<TH>, <TD>
Valign="Top, Midle, Bottom,
Base, Line"
- Dùng để căn lề chữ trong ô theo chiều đứng.
Thuộc tính này dùng kèm bên các thẻ <TR>,
<TH>, <TD>
WIDTH=n% - Dùng để đặt độ rộng của ô, bảng. Thuộc tính
này dùng kèm các thẻ <TABLE>, <TD>
COLSPAN=n - Dùng để hợp nhất số cột lại thành một,
thuộc tính này dùng cho các thẻ: <TD>,
<TH>.
ROWSPAN=n - Dùng để hợp nhất số dòng lại thành một.
Thuộc tính này dùng cho các thẻ: <TD>,
<TH>.
Ví dụ: để có một bảng sau đây trên trình duyệt
Danh sách cán bộ
TT Họ và tên Ngày sinh
1 Trần Văn Ba 20/10/1981
2 Trần Văn Nam 10/10/1982
Ta có thể viết đoạn mã như sau:
<TABLE BORDER=1>
<Caption>Danh sách cán bộ</Caption>
<TR>
12
<TD>TT</TD><TD>Họ và tên</TD><TD>ngày sinh</TD>
</TR>
<TR>

<TD>1</TD><TD>Trần Văn Ba</TD><TD>20/10/1981</TD>
</TR>
<TR>
<TD>2</TD><TD>Trần Văn Nam</TD><TD>10/10/1982</TD>
</TR>
</TABLE>
5. ĐƯA HÌNH ẢNH VÀO TÀI LIỆU
Cú pháp:
<IMG SRC=”URL” ALT=”alternative text” Width=n HEIGHT=n
ALIGN=”Top | Middle | Left | Right” HSPACE=n VSPACE=n BORDER=n>
Các thuộc tính được mô tả theo bảng sau:
Thuộc tính Mô tả Chú thích
SRC=”URL” Địa chỉ nơi có tệp
ảnh
Các tệp ảnh dạng .BMP, GIF,
JPG,
ALT=”đoạn chữ
thay thế”
Đoạn chữ hiển thị
thay thế cho ảnh
Nên có vì không phải lúc nào cũng
hiển thị được ảnh
WIDTH=n
HEIGHT=n
Đặt chiều rộng,
chiều cao của khung
ảnh
Đảm bảo cho text nạp và hiển thị
trước
ALIGN=”Top |

Middle | Left |
Right”
Vị trí đặt ảnh Canh lề ảnh
VSPACE=n
HSPACE=n
Viền trống xung
quanh khung ảnh
Dùng kèm với align để tạo viền
trống xung quanh ảnh
BORDER=n Độ đậm hay thanh
mảnh của khung ảnh
khi ảnh cũng là đầu
mối liên kết
Có thể đặt BORDER=0 nêu muốn
loại bỏ khung viền
Việc chèn ảnh hoạt hình vào trang Web không có gì khác so với chèn ảnh
bình thường.
Tạo ảnh hoạt hình là một trong những cách tốt nhất thu hút sự chú ý của
người đọc.
13
Việc tạo ảnh hoạt hình cũng khá đơn giản. Nguyên lý chung là cho trình
diễn một loại ảnh tĩnh gần tương tự nhau, mỗi ảnh sẽ là một trạng thái trong hoạt
cảnh muốn trình diễn.
Có nhiều công cụ làm sẵn cho phép tạo ảnh hoạt hình. Một trong số các
công cụ đó là Ulead GIF Animator.
Ví dụ: để đưa một ảnh lưu trên đĩa trong thư mục C:\HOMEPAGE với tên file
“anh1.gif” ta có thể viết:
<IMG SRC=”C\HOMEPAGE\anh1.gif” ALT=”ảnh trường CĐSPKT Vinh”
Width=200 HEIGHT=200
ALIGN=”Middle” HSPACE=4 VSPACE=4 BORDER=0>

6. CÁC MỐI LIÊN KẾT SIÊU VĂN BẢN
Có hai loại liên kết:
a. Liên kết ngoài - External Links
Để liên kết đến một tài liệu khác , ta cần phải biết địa chỉ URL của tài liệu
đích. Cũng cần phải chỉ chỗ, thường là một nhóm vài từ để làm đầu mối liên kết.
Nhóm từ này sẽ đổi màu để phân biệt, con chuột trỏ vào sẽ có hình bàn tay và khi
nhấn chuột thì trang siêu văn bản đích sẽ được hiển thị.
Nên cố gắng chọn các từ làm đầu mối sao cho gợi tả và tự nhiên như một
thành phần hữu cơ của câu văn. Tránh lặp đi lặp lại “click here” khi tạo đầu mối
liên kết.
Cú pháp để chọn ra một mối liên kết tới tài liệu khác – liên kết ngoài - là như
sau:
<A HREF=”URL”>nhóm từ làm đầu mối</A>
• Địa chỉ tuyệt đối
Khi liên kết tới một tệp nằm ở ngoài máy tính cục bộ ta phải nêu rõ giao thức
và đầy đủ địa chỉ URL của tệp đích.
Ví dụ:
<A HREF=””>hotmail</A>
<A HREF=””>Yahoo</A>
• Địa chỉ tương đối
Nếu liên kết đến một tệp ở ngay trên máy chủ thì không cần dùng địa chỉ
URL tuyệt đối mà dùng địa chỉ tương đối. Thay cho URL là tên tệp cùng với
đường dẫn đến thư mục nơi chứa tệp đích.
<A HREF=”path & filename”> . . . </A>
14
Ví dụ:
<A HREF=”example1.htm”>Vi du 1 </A>
b. Liên kết nội tại - Internal Link
Cũng có thể tạo mối liên kết trong bản thân tài liệu siêu văn bản, từ phần này
đến phần khác. Điều này rất có ích khi tài liệu có kích thước lớn. Ta có thể tạo

mục lục toàn bộ nội dung trên phần đầu trang gồm tên các chương và liên kết
từng tên chương đến phần nội dung tương ứng.
Để làm điều này, cần đánh dấu điểm đích (book mark) của liên kết bằng thẻ
neo <A Name=”tên điểm đích”>.
Trong thẻ neo tại điểm đầu của mối liên kết thì thay URL bằng
<tên_điểm_đích>.
<A HREF=”#tên_điểm_đích”>
Ví dụ: trong liên kết nội tại dưới đây đã tạo một book mark ở đầu trang với tên là
TOP. Thẻ neo liên kết ở dòng dưới có dạng <A HREF=”#Top”>Về đầu
trang</A>
6.2. Chèn tệp âm thanh vào tài liệu
Để chèn một đoạn âm thanh vào tài liệu HTML ta cũng theo đúng qui tắc
tạo mối liên kết thông thường. Trong thẻ neo, tại địa chỉ URL bây giờ là địa chỉ
của tệp âm thanh.
Dưới đây là một ví dụ về chèn tệp âm thanh vào tài liệu. Khi nhấn chuột tại
mối liên kết tệp âm thanh sẽ được phát lại.
<A HREF=”sounds/hawaii.au”>Welcome to Hawaii ! </A>
- Tạo âm thanh nền - Embedding Sound Files
Không những có thể chèn tệp âm thanh vào tài liệu HTML mà còn có thể
nhúng âm thanh vào tài liệu, nghĩa là tạo âm thanh nền phát ra khi bắt đầu hiển thị
trang tài liệu.
Để nhúng âm thanh vào tài liệu ta dùng thẻ như ví dụ sau đây:
<EMBED SRC=”Sounds/hakuna.mid” height=50 width=200 autostart=true
Loop=true>
6.3. Chèn tệp video
15
Việc chèn tệp video vào tài liệu hoàn toàn tương tự chèn tệp âm thanh vào tài
liệu

7. KHÁI NIỆM CHUNG VỀ FORM

Bộ thẻ <FORM> và </FORM>: Giống như thẻ <BODY>, trong bộ thẻ
<FORM> </FORM > có chứa các thành phần của thẻ HTML để tạo nên trang
Web. Trong thẻ <FORM> có chứa các thuộc tính tác động:
Action: là thuộc tính tác động đến tên của chương trình mà ta sẽ dùng
để thực hiện form khi Form được gửi tới Server.
Method: Dùng để qui định cách thức gửi dữ liệu từ Client tới Server,
thuộc tính này cung cấp cho ta hai phương pháp:
• Get: Đây là thuộc tính mặc định, dữ liệu gửi tới Server được gộp vào cùng
với URL khi truyền đi. Đặc điểm của phương thức này là dữ liệu gửi đi
nhanh nhưng có độ dài hạn chế, không an toàn khi dữ liệu dài vì sẽ bị tự
động cắt bớt.
• Post: Cho phép gửi dữ liệu có độ dài không hạn chế và an toàn hơn.
Các thành phần của Form
• Thẻ <INPUT>: Là một phần tử đặc biệt được tạo trong thẻ <Form>. Cho
phép ta nhập các thông tin để gửi tới một chương trình trên Server. Thẻ này
có 5 thuộc tính.
Thuộc tính Type: Dùng để điều khiển vùng nhập liệu, thuộc tính này có các
giá trị sau:
_ Text: Vùng nhập liệu là văn bản chuẩn (mặc định).
_ Number: Cho phép vùng nhập liệu vào là số.
_ Password: Là vùng văn bản có mặt nạ khi nhập liệu.
_ Button: Tạo nút chọn
_ Hiden: Vùng văn bản ẩn, nó không giống như Password. Đây là vùng dữ
liệu không hiển thị trên trang Web.
_ Checkbox: Dùng để đặt các hộp trên đó, trên đó dùng để kiểm tra trạng
thái ON hoặc OFF.
_ Radio: Dùng dể đặt những cái nút có tác dụng lẫn nhau cho phép người
dùng chọn ON hoặc OFF.
_ Image: Là những ảnh đồ hoạ mà người dùng có thể kích trên đó để thực
hiện các Form.

_ Submit: Là nút mà người dùng có thể tác động trên đó để thực hiện form.
_ Reset: Là nút mà khi người dùng tác động đến, toàn bộ dữ liệu trên form
sẽ bị xoá hết.
16
Thuộc tính Name: Là tên duy trì vùng dữ liệu khi nó được gọi lại từ một
chương trình, thường dùng trong các Script.
Thuộc tính Size: Dùng để quy định độ dài vùng nhập dữ liệu.
Thuộc tính Maxlength: Là độ dài tối đa của vùng nhập liệu.
Thuộc tính Value: Là giá trị mặc định cho một thành phần trên FORM.
• Thẻ <TextArea> và </TextArea>
Dùng để tạo ra văn bản rộng lớn không hạn chế số dòng trên trang Web.
Vùng này sẽ tự động thêm vào thanh cuốn khi cần thiết. Bộ thẻ này thường dùng
cho những trường memo của form và văn bản trong bộ thẻ này là mặc định cho
TextArea. TextArea cung cấp cho các thuộc tính sau:
Name: Dùng để đặt tên cho Textarea.
Row: Số lượng dòng cần hiển thị.
Col: Số lượng cột cần hiển thị.
• Thẻ <Select> và </Select>: Cho phép người sử dụng tạo các menu Popup.
Trong bộ thẻ này nó cung cấp thêm một số thẻ bên trong kèm theo các thuộc
tính sau:
Thuộc tính Name: Dùng để đặt tên cho menu.
Thuộc tính Size: Bố trí dòng được hiển thị trên trang Web Browser
Thuộc tính Multiple: Cho phép lựa chọn nhiều dòng.
• Thẻ <Option>: Là kí hiệu cho phép lựa chọn một hay nhiều dòng cùng lúc
khi thẻ <Select> được bắt đầu.
8. KHUNG - FRAMES
• Thẻ <Frameset> và </Frameset>:
Bộ thẻ này dùng để chia màn hình thành các phần riêng biệt và mỗi phần có thể
nạp một tài liệu khác nhau, tài liệu trong mỗi Frame này có thể cập nhật từ một
Frame khác. Bộ thẻ Frame này khi sử dụng nó thay thế cho bộ thẻ <BODY>.

Trong thẻ Frameset này có chia thuộc tính:
_ Cols: Dùng để tạo độ rộng cho các cột.
_ Rows: Đặt chiều cao của các dòng trong Frameset.
Giá trị của Cols và Rows được tính bằng phần trăm của cửa sổ hiện thời, hoặc số
pixel.
• Thẻ <Frame>: Dùng để đặt nội dung cho các cửa sổ của Frameset. Trong
thẻ này có các thuộc tính:
_ SRC: Cho phép ta móc nối với một tài liệu của URL. Tài liệu đó sẽ được
hiển thị trong Frame được chọn.
17
_ Name: Dùng để đặt tên cho Frame, nhờ thuộc tính này mà Frame có thể cập
nhật một tài liệu được liên kết từ trong một Frame khác.
_ MarginWidth và MarginHeight: Được dùng để hiệu chỉnh kích thước trên,
dưới, trái , phải của tài liệu trong Frame. Giá trị này được tính bằng pixel.
_ Scrolling: Đây là thuộc tính điều khiển thanh cuốn của Frame, có 3 giá trị:
+ Yes: Thanh cuốn luôn luôn xuất hiện trong Frame thậm chí lúc Frame
không đầy.
+ No: Thanh cuốn sẽ không có trên Frame, trường hợp này sẽ gây nguy
hiểm nếu dữ liệu dài hơn Frame.
+ Auto: Trường hợp này là mặc định, nếu browser thấy cần thiết
_ Noresize: Thuộc tính này dùng để hạn chế người dùng sửa chữa kích thước
khung.
Thẻ <NoFrame> và </NoFrame>: Bộ thẻ này dùng hỗ trợ cho các Browser
không có hỗ trợ Frame lúc đó nội dung này sẽ được hiển thị.
Ví dụ: để tạo ra một màn hình gồm 3 phần có dạng:
Menu-win
header-win
body-win
Nội dung chương trình:
<HTML>

<HEAD>
<TITLE>My homepage</TITLE>
</HEAD>
<FRAMESET cols="200,*" BORDER=0 frameborder="0">
<FRAME NAME="menu-win" SRC="mainlnk.htm" SCROLLING="No"
CELLPADDING="0" CELLSPACING="0" NORESIZE>
<FRAMESET ROWS="100,*" MARGINWIDTH="0" MARGINHEIGHT="0"
BORDER=0>
<FRAME NAME="header-win" SRC="Header.htm" SCROLLING="No"
CELLPADDING="0" CELLSPACING="0" NORESIZE>
<FRAME NAME="body-win" SRC="dc.htm" SCROLLING="Auto"
CELLPADDING="0" CELLSPACING="0" NORESIZE>
</FRAMESET>
</FRAMESET>
18
</HTML>
9. BỘ THẺ TƯƠNG TÁC VỚI NGÔN NGỮ JAVA:
Thẻ <Applet> và </Applet>: Dùng để gói một chương trình áp dụng chạy
trên Java. Thông thường bộ thẻ này được sử dụng cho các chương trình hình ảnh
sống động và kết hợp âm thanh. Ưu điểm lớn nhất của bộ thẻ này là có thể tạo ra
các chương trình áp dụng chạy với tốc độ nhanh. Những chương trình này được
điều khiển bằng các thông số thiết lập trên ngôn ngữ HTML. Nó có thể kết hợp
các âm thanh, hình ảnh một cách dễ dàng. Trong thẻ này có các tính chất sau:
_ Code: Dùng để gọi tên chương trình Java áp dụng.
_ Width và Height: Là độ rộng và độ cao của cửa sổ chương trình
_ Codebase: Là thư mục chứa chương trình mà ta sẽ chạy.
_ Align: Là thuộc tính điều khiển vị trí của sổ chương trình
_ Vspace và Hspace: Là khoảng không theo chiều đứng và theo chiều
ngang bao lấy cửa sổ chương trình áp dụng.
Thẻ <Param>: Được sử dụng trong bộ Tag <Applet>, Tag này có thể không

có hoặc có rất nhiều, tuỳ theo chương trình áp dụng.
Ví dụ: giả sử đã có một chương trình “Helloworld.java” ta đã biên dịch thành tệp
“Helloworld.class”, muốn nhúng vào trang web ta có đoạn chương trình sau:
<APPLET CODE=”Helloworld.class” WIDTH=150 HEIGHT=25>
</APPLET>
BÀI TẬP CHƯƠNG 2
2.1Thế nào là trang mã nguồn và trang Web?.
2.2 Cấu trúc của một tài liệu HTML. Các thẻ HTML là gì?.
2.3 Ý nghĩa của các thẻ trình bày trang trong HTML.
2.4 Nêu các thuộc tính của thẻ <FONT> . .</FONT>.
2.5 Trình bày cách dùng các thẻ danh sách và bảng.
2.6 Muốn đưa ảnh vào tài liệu HTML ta dùng ảnh nào?. Nêu các thuộc tính của
thẻ đó.
2.7 Có những loại liên kết nào trong một tài liệu HTML?. Muốn tạo liên kết ta
dùng thẻ nào? Cho ví dụ.
2.8 Có các thuộc tính nào tác động trong FORM? Ý nghĩa của các thuộc tính đó.
2.9 Nêu các thành phần của FORM.
2.10 Cách sử dụng thẻ <FRAMESET> . .</FRAMESET> để chia màn hình
trình duyệt thành các phần riêng biệt. Viết đoạn mã để chia màn hình trình
duyệt thành các Frame có dạng sau:
Head-win (150 pixel)
19
Menu1-win
(200 pixel)
Body-win Menu2-win
(150 pixel)
2.11 Xây dựng trang Web tĩnh tạo danh sách lớp học của bạn.
2.12 Xây dựng trang Web giới thiệu về bản thân.
CHƯƠNG 3 NGÔN NGỮ LẬP TRÌNH VBSCRIPT
1.GIỚI THIỆU VỀ NGÔN NGỮ LẬP TRÌNH VBSCRIPT

Microsoft Visual Basic Script là một phần mới của họ ngôn ngữ lập trình Visual
Basic. VBScript là một script rất có hiệu quả trên những môi trường đa dạng, bao gồm
cả Web client (Internet Explorer) hay Web Server (Microsoft Internet Infomation
Server). Những đoạn lệnh của VBScript được chèn trực tiếp vào trang Web mà không
phải dịch trước, nó được tự động dịch mỗi khi Web Browser gặp.
2.CÁC KIỂU DỮ LIỆU TRONG VBSCRIPT
Trong VBScript có duy nhất một kiểu dữ liệu đó là kiểu Variant. Tuỳ vào ngữ
cảnh mà một biến Variant là số, hoặc là xâu. Trong kiểu Variant cũng chứa các kiểu con
20
cho phép người lập trình sử dụng chính xác kiểu biến. Nếu không khai báo chính xác
kiểu của biến thì biến sẽ có kiểu Variant và VBScript sẽ sử dụng biến với kiểu dữ liệu
con của Variant thích hợp nhất. Trong kiểu Variant có chứa các kiểu con sau:
KIỂU CON MÔ TẢ
Empty
Variant không được khởi tạo.Giá trị là 0 cho biến kiểu
số, xâu độ dài là 0 cho các biến kiểu xâu.
Null Biến Variant không chứa thông tin thích hợp.
Boolean Mang hai giá trị True hoặc False
Byte Các số nguyên từ 0 đến 255
Integer Các số nguyên trong phạm vi -32768 đến 32767
Currency Kiểu tiền tệ có độ dài 8 byte.
Long Chứa các số nguyên có độ dài 4 byte
Single Kiểu dấu phẩy động có độ chính xác đơn
Double Kiểu dấu phẩy động có độ chính xác kép
Date Kiểu thời gian (gồm Date+Time)
String Chứa các xâu ký tự có độ dài thay đổi.
Object Chứa một đối tượng
Error Chứa mã lỗi
• Quy tắc sử dụng biến:
Trong VBScript chấp nhận việc sử dụng biến không qua khai báo. Nếu muốn

khại báo ta có thể khai báo với cú pháp như sau:
Dim <Tên biến>
Public <Tên biến>
Private <Tên biến>
Khai báo hằng: Const <tên hằng> = <giá trị của hằng>
Khai báo mảng: Dim <Tên mảng>(độ dài tối đa của mỗi chiều)
Ví dụ : A(2,3) Mảng A có kích thước 2 x 3
VBScript cũng cho phép sử dụng mảng có kích thước động nhưng chỉ được phép
dùng trong một thủ tục. Cách khai báo mảng có kích thước động như sau:
Dim <Tên mảng>()
21
Khi cần dùng đến có thể khởi tạo bởi lệnh:
Redim <Tên mảng>(Độ dài tối đa của mỗi chiều)
3. CÁC TOÁN TỬ TRONG VBSCRIPT
3.1. Các toán tử số học
^ (Luỹ thừa), *, /, \ (chia nguyên), mod (phần dư),+,-,&(Nối hai xâu)
Các toán tử so sánh:
=, <>, <, >, <=, >=, is (Đối tượng bằng)
3.2. Các toán tử logic
Not, And, or, Xor, Eqv (Bằng).
3.3. Các toán tử điều khiển
a. Cấu trúc if then (dạng khuyết):
Cú pháp:
Một dòng lệnh:
If <biểu_thức_điều_kiện> then <câu lệnh>
Nhiều dòng lệnh:
If <biểu_thức_điều_kiện> then
<Các câu lệnh>
end if
Tác động: nếu <biểu_thức_điều_kiện> có giá trị đúng (true), máy thực hiện tất cả các

dòng lệnh sau Then.
Ví dụ: Tìm max của hai số a,b ta có thể viết đoạn mã như sau:
Max=a
If a<b then max=b
b. Câu lệnh if . . then . . else (dạng đủ):
Cú pháp:
If <biểu_thức_điều_kiện> then <câu lệnh 1> Else <câu lệnh 2>
Hoặc
If <biểu_thức_điều_kiện_1> then
22
<Các câu lệnh 1>
[ Else <biểu_thức_điều_kiện_2> then
<Các câu lệnh 2>]] . . .
[else
<Các câu lệnh n>]
End If
Tác động: nếu <biểu_thức_điều_kiện_1> có giá trị đúng (true), máy thực hiện
<câu lệnh 1>, trái lại máy thực hiện <câu lệnh 2>.
Ví dụ:
Tìm max, min của hai số a,b:
If a>b then
Max=a
Min=b
Else
Max=b
Min=a
End if
c. Câu lệnh Select Case:
Cú pháp:
Select case <Biểu_thức_kiểm_tra>

Case <danh_sách_Giá_trị_1>
<Các lệnh 1>
Case <danh_sách_Giá_trị_2>
<Các lệnh 2>
. . .
Case <danh_sách_Giá_trị_n>
<Các lệnh n>
[else
<Các lệnh n+1>]
End Select
Tác động: máy tính giá trị của <Biểu_thức_kiểm_tra>. Nếu giá trị của
<Biểu_thức_kiểm_tra> bằng một trong các giá trị của <danh_sách_giá_trị_i> thì
máy thực hiện <Các câu lệnh i>, sau đó thực hiện các lệnh sau End select nếu có.
Nếu có tuỳ chọn [else . . .] mà giá trị của <Biểu_thức_kiểm_tra> không trùng với
giá trị nào trong danh sách giá trị thì máy thực hiện <Các câu lệnh n+1>.
Ví dụ:
Select case chon
Case 1
23
Str=”Chon =1”
Case 2
Str=”chon=2”
Case 3
Str=”chon=3”
End select
3.4.Các cấu trúc lặp
VBScript hỗ trợ một số cấu trúc lặp sau:
a. Cấu trúc Do . . . Loop while:
Cú pháp:
DO

<Các câu lệnh>
LOOP WHILE <biểu_thức_điều_kiện>
Tác động:
- Thực hiện <Các câu lệnh>, sau đó máy kiểm tra <biểu_thức_điều_kiện>, nếu
<biểu_thức_điều_kiện> còn đúng thì còn thực hiện <các câu lệnh>.
Ví dụ: tính tổng từ 1 đến 100.
dim i,tong
i=1
tong=0
do
tong=tong+i
i=i+1
loop while i<=100
b. Cấu trúc do while . . . loop:
Cú pháp:
DO WHILE <Biểu_thức_điều_kiện>
<các câu lệnh>
LOOP
24
Tác động:
Chừng nào <biểu_thức_điều_kiện> còn đúng thì còn thực hiện <các câu lệnh>.
Ví dụ: Tính tổng từ 1 đến 100.
dim i,tong
i=1
tong=0
do while i<=100
tong=tong+i
i=i+1
loop
c. Cấu trúc while . . . wend:

Cú pháp:
While <biểu_thức_điều_kiện>
<Các câu lệnh>
Wend
Tác động: tương tự như lệnh DO WHILE . . LOOP
d. Cấu trúc For . . . Next:
Cú pháp:
For <biến_điều_khiển>=<Cận_đầu> TO <Cận_cuối> [STEP <Bt số>]
<Các câu lệnh>
NEXT
Tác động:
<Các câu lệnh> được thực hiện một số lần từ <Cận_đầu> đến <Cận_cuối>, sau
mỗi lần biến điều khiển nhận giá trị bằng <biến_điều_khiển> cộng với <Bt số>.
- Nếu <Bt số> dương <biến_điều_khiển> tăng.
- Nếu <Bt số> âm <biến_điều_khiển> giảm.
- Nếu không có tuỳ chọn [STEP <Bt số>], <biến_điều_khiển> tự động tăng một
đơn vị.
25