Lập trình web potx
Bạn đang xem bản rút gọn của tài liệu. Xem và tải ngay bản đầy đủ của tài liệu tại đây (322.63 KB, 90 trang )
1
2
CHƯƠNG 0 : GIỚI THIỆU VỀ WEB
I. World Wide Web _ WWW :
WWW thừơng đựơc gọi là tắt là Web. Web là một mạng máy tính có qui mô toàn thế
giới. Tất cả các máy tính trong Web có thể truyền thông với nhau. Tất cả các máy
tính sử dụng một nghi thức chuẩn gọi HTTP.
Thông tin Web đựơc cất giữ trong những tài liệu gọi là những trang Web. Những trang
Web là những tập tin cất giữ trong những máy tính gọi là những server Web. Những
máy tính đọc những trang Web đựơc gọi những Web clients.Những Web client xem
những trang với một chương trình gọi là một trình duyệt Web hay Web browser.
Một trình duyệt tải một trang Web từ server thông qua một yêu cầu HTTP chuẩn chứa
một đòa chỉ trang URL.
Tất cả các trang Web chứa đựng những lệnh để trình bày. Trình duyệt trình bày trang
thông qua việc đọc những lệnh này. Những lệnh trình bày chung nhất đựơc gọi thẻ
HTML.
II. HTML :
HTML viết tắt của “Hyper Text Markup Language”. Một file HTML là một tập tin
văn bản chứa đựng thẻ đánh dấu. Thẻ đánh dấu nói cho trình duyệt Web làm sao để
trình bày trang. Một file HTML có thể đựơc tạo ra bằng cách sử dụng một chơng
trình soạn thảo văn bản đơn giản như notepad, textpad, …
1. Thẻ HTML :
Những thẻ HTML đựơc sử dụng để đánh dấu những phần tử HTML. Những thẻ
HTML đựơc bao bởi hai kí tự '<' Và '>'. Những thẻ HTML không phải phân biệt chữ
thường, chữ hoa
Thẻ HTML chi làm 2 nhóm chính :
. Thẻ điều khiển (thẻ rỗng) : chỉ gồm một thẻ duy nhất.
. Thẻ nội dung (phần tử HTML) : bao gồm một cặp thẻ. Thẻ đầu tiên trong
một cặp là thẻ mở , thẻ (thứ) hai là thẻ đóng. Văn bản giữa thẻ mở và thẻ đóng là nội
dung
Ví dụ :
3
<html>
<head>
<title>Title of page</title>
</head>
<body> This is my first homepage.<br><b>This text is bold</b>
</body>
</html>
2. Thuộc tính thẻ
Những thẻ có thể có những thuộc tính Những thuộc tính có thể cung cấp thêm các
thông tin về những phần tử HTML trên trang web.
Những thuộc tính luôn luôn ở dạng "tên = giá trò"
Ví dụ:
< body bgcolor ="red ">
…
</body>
Thẻ <body> đònh nghóa nội dung trang HTML .Với một thuộc tính bgcolor đựơc thêm,
chúng ta có thể nói với trình duyệt rằng nền trang cần phải đỏ.
4
CHƯƠNG 1 : HTML
I Cấu trúc tổng quát của một trang Web
II Phần Header
1. Thẻ <head>
2. Thẻ <title>
3. Thẻ <meta>
III Phần Body
1. Các thẻ hổ trợ cho đònh dạng văn bản
a. Đònh dạng cho các đoạn văn:
< b > đònh nghóa văn bản in đậm
< big > đònh nghóa văn bản in lớn
< em > đònh nghóa văn bản đựơc nhấn mạnh
< i > đònh nghóa văn bản nghiêng
< small > đònh nghóa văn bản nhỏ
< strong > đònh nghóa văn bản đậm
< sub > đònh nghóa văn bản subscripted (chỉ số )
< sup > đònh nghóa văn bản superscripted (số mũ)
< u > đònh nghóa văn bản gạch dứơi.
< h1 >-< h6 > đònh nghóa heading 1 tới heading 6
Những heading đựơc đònh nghóa từ thẻ < h1 > đến thẻ < h6 >.
< h1 > đònh nghóa heading lớn nhất.
5
< h6 > đònh nghóa heading nhỏ nhất.
HTML tự động thêm một dòng trắng trứơc và sau một heading.
< p > đònh nghóa một đoạn (paragraph)
HTML tự động thêm một dòng trắng thêm trứơc và sau một đoạn.
< address > đònh nghóa một phần tử đòa chỉ
< bdo > đònh nghóa hứơng văn bản
<bdo dir=[ltr | rtl]> nội dung </bdo>
< blockquote > đònh nghóa một trích dẫn dài
< tt > đònh nghóa văn bản điện báo
< pre > đònh nghóa văn bản đựơc tạo khuôn trứơc.
<br > dùng để xuống hàng
Thẻ < br > đựơc sử dụng khi bạn muốn kết thúc một dòng, nhưng không
muốn khởi động paragraph mới. < br > Thẻ là một thẻ rổng. Nó không
có thẻ đóng.
<! > đònh nghóa một chú thích trong mã nguồn HTML
Thẻ chú thích đựơc sử dụng để chèn một chú thích trong mã nguồn
HTML.Một chú thích sẽ đựơc bỏ qua bởi trình duyệt.
Chú ý : cần một dấu'!' chỉ sau móc mở.
b. Đường kẻ ngang :
< hr size = “ độ dày “ width = “ chiều rộng “ align = “ hướng “ [noshare ] >
chiều rộng : pixels, %
hướng : [right | left | center]
noshare : tạo bóng
c. Đònh dạng danh sách :
+ Danh sách không đánh số thứ tự
Một danh sách không thứ tự là một danh mục.
Một danh sách không thứ tự bắt đầu với thẻ < ul >
Mỗi phân tử danh sách bắt đầu với thẻ < li >.
6
Bên trong một phân tử danh sách chúng ta có thể đặt chia đoạn, xuống dòng,
những ảnh, những mối liên kết, danh sách khác ,v.v.
< UL type =”[ disc | square | circle ] ” >
< LI > item
< / UL>
Ví dụ :
< UL >
< LI > item 1
< LI > item 2
< / UL >
+ Danh sách được đánh số thứ tư
Một danh sách có thứ tự cũng là một danh mục.
Những phân tử danh sách đựơc đánh dấu với những số.
Một danh sách đựơc sắp thứ tự bắt đầu với thẻ < ol >
Mỗi phân tử danh sách bắt đầu với thẻ < li >.
Bên trong một phân tử danh sách chúng ta có thể đặt chia đoạn, xuống dòng,
những ảnh, những mối liên kết, danh sách khác ,v.v.
ï
< OL start = value type =”[ 1 | a | A | i | I ] ” >
< LI value = “ gia tri “ > item
< / UL>
Ví dụ :
< OL type = 1>
< LI > item 1
< LI > item 2
< LI value= 100> item 3
< LI > item 4
< / OL >
+ Danh sách tự đònh nghóa
Một danh sách tự đònh nghóa không phải là danh mục hàng hóa.
Danh sách này là một danh sách những phần tử và giải thích những phần tử
đó.
Một danh sách tự đònh nghóa bắt đầu với thẻ < dl > .
Mỗi phần tử bắt đầu với thẻ < dt >.
Mỗi giải thích bắt đầu với thẻ < dd >.
Bên trong một phân tử danh sách chúng ta có thể đặt chia đoạn, xuống dòng,
những ảnh, những mối liên kết, danh sách khác ,v.v.
7
< DL>
< DT > Tiêu đề
< DD > đònh nghóa
</ DL >
Ví du :
< DL >
< DT > RAM
< DD > Read Access Memory
< /DL >
d. Thực thể ký tự :
Vài kí tự có một nghóa đặc biệt bên trong HTML, như ký tự '<' đònh nghóa bắt
đầu một thẻ HTML. Nếu chúng ta muốn trình duyệt thật sự trình bày những kí tự này
chúng ta phải chèn những thực thể kí tự trong mã nguồn HTML.
Một thực thể ký tự chia ra làm 3 phần : một ký hiệu & , một tên thực thể hoặc
là '# và một số, và cuối cùng là một dấu chấm phẩy (;).
Ví dụ :
Để trình bày một dấu ít hơn trong một tài liệu HTML chúng ta phải viết : & Lt;
or <
Lợi thế việc sử dụng một tên thay vì một số là một tên dễ nhớ hơn.Sự bất lợi
là không phải là tất cả trình duyệt đều hổ trợ cho những tên thực thể mới nhất, trong
khi sự hỗ trợ cho thực thể ghi số rất tốt trong gần như tất cả các trình duyệt.
Chú y :ù những thực thể ký tự phân biệt chữ thường, chữ hoa.
Những thực thể ký tự thông thường :
Result Description Entity Name Entity Number
non-breaking space  
< less than < <
>
greater than > >
& ampersand & &
" quotation mark " "
' apostrophe '
8
Result Description Entity Name Entity Number
¢ cent ¢ ¢
£ pound £ £
¥
Yen ¥ ¥
§ section § §
© copyright © ©
® registered trademark ® ®
× multiplication × ×
÷ division ÷ ÷
2. Hình ảnh
Trong HTML, hình ảnh đựơc đònh nghóa với thẻ < img >.Thẻ < img > là thẻ rỗng.
Cú pháp :
< img src=” tên hình “ align = “value “ alt = “chú thích” width = “ value”
height=”value” hspace =”value” vspace = ” value” >
src : URL của ảnh chúng ta muốn trình bày trên trang web
align = [ top | bottom | middle | left | right ] ( default = middle )
width / height : đònh kích thước hình ảnh
hspace / vspace : khoảng cách giữa hình và chữ ( đơn vò pixels )
alt : đựơc sử dụng để đònh nghóa một "chú thích" cho một ảnh.
+ Image Map
Image Map bắt buộc phải có height và width
< img src = “tên hình” alt = “chú thích” width = “value” height = “value”
USEMAP = “ # tên map “ >
<map name= “tên map” >
<area href = ” liên kết” alt = “chú thích“ shape= [rect | circle | polygon]
coords = “danh sách tọa độ “ >
< /map >
coords : danh sách các đối số phụ thuộc vào shape
rect : 4 đối số (left – top – right – bottom )
circle : 3 đối số ( x, y , r )
polygon : 2 * n đối số
Ví dụ:
<img src=”vietnam.gif” width = 640 height = 480 usemap =”#vietnam” >
< map name = “vietnam” >
9
< area href=”hanoi.htm” shape = rect coords=”100,100,200,200” >
< area href=”hue.htm” shape = circle coords=”300,300,20” >
< area href=”hcm.htm” shape=polygon coords=”400,400,410,410,500,420” >
< / map>
3. Siêu liên kết
HTML sử dụng thẻ < a > ( anchor) để tạo ra một mối liên kết tới tài liệu khác.
Một anchor có thể chỉ tới bất kỳ tài nguyên nào trên Web : một trang HTML, một
ảnh, một âm thanh sắp xếp, một movie, v.v.
Cú pháp 1:
<a href="url" [target=name]>nội dung</a>
href : đựơc sử dụng để hứơng vào tài liệu cần liên kết , và nội dung của thẻ
anchor sẽ đựơc trình bày nh một hyperlink.
target : đònh nghóa nơi tài liệu đựơc liên kết sẽ đựơc mở.
target =" _blank " Tải tài liệu mới trong một cửa sổ mới
target =" _self " Tải tài liệu mới trong cùng cửa sổ.
target =" _parent " Tải tài liệu mới trong cửa sổ cha (frame)
target =" _top " Tải tài liệu mới trong toàn bộ cửa sổ trình duyệt.
Cú pháp 2:
<a name="nhãn>nội dung</a>
name : đựơc sử dụng để tạo ra một anchor có tên.Khi sử dụng những anchor có
tên chúng ta có thể tạo ra những mối liên kết mà có thể nhảy trực tiếp vào trong một
đoạn đựơc chỉ rõ trong một trang
Ví dụ :
<a name="tips">Read the Useful Tips section</a>
Cần phải chú ý một có tên mà anchor không trình bày trong một cách đặc biệt.
Để liên kết tới anchor có tên, chúng ta thêm dấu '#' và tên anchor sau URL.
Ví dụ :
<a href=" Read the Useful Tips
section</a>
Những anchor có tên thường đựơc sử dụng để tạo ra " mục lục " ở khi bắt đầu
một tài liệu lớn. Mỗi chương bên trong tài liệu đựơc gán cho một anchor có tên, và
những mối liên kết tới tất cả những anchor đựơc đặt tại đỉnh tài liệu.
Nếu một trình duyệt không thể tìm thấy một tên anchor, nó sẽ trỏ đến đỉnh tài
liệu. Không xuất hiện lỗi ở đây.
10
Chú ý : nên sử dụng đường dẫn tương đối trong các siêu liên kếtNên
+ Đường dẫn tương đối
/ : về thư mục cha
MY
FOLDER
A
H
I. htm
D. htm
E. htm
B
C
F. htm
G. htm
- Từ F.htm đến D.htm
< A href=” / A / D.htm ” > < / A >
- Từ I.htm đến F.htm
< A href=” / / C / F.htm” >
4. Table
Những bảng đựơc đònh nghóa với thẻ <table>. Một bảng đựơc chia vào trong những
hàng với thẻ <tr>, và mỗi hàng đựơc chia cắt thành các đơn vò với thẻ <td>. Một đơn
vò có thể chứa đựng những văn bản, những ảnh, những danh sách, những đoạn, những
form, thanh ngang, table khác, v.v.
Một bảng tổng quát có dạng như sau :
< TABLE >
< TR > // dòng
< TD > a < / TD >
< TD > b < / TD >
< / TR >
< TR >
< TD > c < / TD >
< TD > d < / TD >
11
< / TR >
< / TABLE >
a. Các thuộc tính của thẻ TABLE
Cú pháp :
<table frame=”loại frame” border=pixel width=value height=value
bgcolor=”màu” cellspacing=pixels cellpadding=pixels
align=[ left | right | center ] rules=”loại rule”>
frame : kết hợp với thuộc tính border để đònh dạng khung của table. Frame đặt
ngay bên phải của table, có các giá trò sau
void : không có khung
above : canh trên
below : canh dưới
lhs : canh trái
rhs : canh phải
hsides : canh trên và dưới
vsides : canh trái và phải
box : canh 4 bên (default )
border : độ dày của khung _ Nếu chúng ta không chỉ rõ một thuộc tính border
table sẽ đựơc trình bày mà không có khung.
width : chiều rộng của table
height : chiều cao của table
bgcolor : màu nền của table
cellspacing : khoảng cách giữa các Cells
cellpadding : khoảng cách giữa các dữ liệu và vách
rules : [ cols | rows | all | groups ] đònh dạng đường phân cách các cell
b. Nhóm các Cell
Nhóm các cell bằng 2 thuộc tính colspan & rowspan của thẻ < TD >
colspan : nhóm các cell theo cột.
rowspan : nhóm các cell theo hàng.
Ví dụ 1 :
< TABLE border = 1 >
< TR >
< TD ROWSSPAN = 4 > < / TD >
< TD > < / TD >
< / TR >
< TR >
12
< TD > < / TD > < / TR >
< TR >
< TD > < / TD > < / TR >
< TR >
< TD > < / TD > < / TR >
< /TABLE >
Keát quaû
Ví duï 2 :
< TABLE border = 1 >
< TR >
< TD COLSPAN = 2 > < / TD >
< / TR >
< TR >
< TD > < / TD >
< TD > < / TD > < / TR >
< TR >
< TD > < / TD >
< TD > < / TD > < / TR >
< /TABLE >
Keát quaû
Ví duï 3 :
< TABLE border = 1 >
< TR >
< TD COLSPAN = 2 > < / TD >
< TD COLSPAN = 2 > < / TD >
< / TR >
< TR >
< TD ROWSPAN = 2> < / TD >
< TD > < / TD >
< TD > < / TD >
13
< TD > < / TD >
< / TR >
< TR >
< TD ROWSPAN = 2 > < / TD >
< TD COLSPAN = 2 > < / TD >
< / TR >
< TR >
< TD > < / TD >
< TD > < / TD >
< TD > < / TD >
< / TR >
< /TABLE >
Kết quả
b. Các thẻ hổ trợ cho bảng
+ Thẻ <caption> : tên của table
Cú pháp :
< caption align = [ top | bottom ] > tên table < / CAPTION >
Ví dụ:
< TABLE border = 1 >
< CAPTION ALIGN = bottom > TABLE 1 < / CAPTION >
< TR >
< TD > a < / TD >
< TD > b < / TD >
< / TR >
< /TABLE >
+ Thẻ <th> : tựa đề cho các cột ( in đậm )
Xuất hiện trên mỗi trang in nếu dài hơn 1 trang. Sử dụng thẻ <th> tương tự như sử
dụng thẻ <td>
Ví dụ:
< TABLE border = 1 >
< TH >
< TD > cột 1 < / TD >
14
< TD > cột 2 < / TD >
< / TH >
< TR >
< TD > a < / TD >
< TD > b < / TD >
< / TR >
< /TABLE >
+ Thẻ <colgroup> : nhó các cột
Cú pháp :
<colgroup span = number >
Các thuộc tính được thiết lập trong <colgroup> sẽ ảnh hưởng đến các cột liên
quan
Xét table sau :
Họ và tên Đòa chỉ Bậc lương
NVA 1.78
LVB 2:2
PTC 4.0
< TR >
< TD > NVA < / TD >
< TD > < / TD >
< TD ALIGN = right > 1.78 < / TD >
< / TR >
< TR >
< TD > LVB < / TD >
< TD > < / TD >
< TD ALIGN = right > 2.2 < / TD >
< / TR >
Để tránh lặp lại nhiều lần dùng thẻ <colgroup>
< TABLE border = 1 RULES = COLS>
< COLGROUP SPAN = 1 ALIGN = right >
< TH >
< TD > Họ tên < / TD >
< TD > Đòa chỉ < / TD >
< TD > Bậc lương < / TD >
< / TH >
< TR >
< TD > NVA < / TD >
15
< TD > < / TD >
< TD > 1.78 < / TD >
< / TR >
< TR >
< TD > LVB < / TD >
< TD > < / TD >
< TD > 2.2 < / TD >
< / TR >
< TR >
< TD > PTC < / TD >
< TD > < / TD >
< TD > 4.0 < / TD >
< / TR >
< /TABLE >
Chú ý :
Những cell không có nội dung nào cha đựơc trình bày tốt trong đa số các
trình duyệt.
Những border xung quanh bộ cell rỗng bò biến mất .Để tránh điều này, thêm
một khoảng trắng (& nbsp;) vào các cell trống
5. Form :
- Form là cơ chế cho phép nhận thông tin phản hồi từ người sử dụng
- Dữ liệu sẽ được truyền đến WebServer để xử lý và gọi/ tạo ra một trang HTML
trả lời
Cú pháp :
< form method=[ get | post ] action= URL [name=”tên form”]
[target=”tên cửa sổ”]>
Các thành phần của Form
< / FORM >
get : những thông tin lên header
post : những thông tin trong Body
Các thành phần của Form bao gồm 3 loại thẻ chính
< textarea >
< select >
MySite
Item 1
Item 2
Item 3
< input >
16
TextBox
User Name
Password
*********
Checkbox
Radio
Reset
Reset
Submit
Submit
Button
File
Hidden
Image
a. Thẻ <textarea> :
Cung cấp một hộp văn bản cho phép người sử dụng có thể nhập vào nhiều dòng
văn bản
Cú pháp :
<textarea name= tên rows=number cols= number
wrap = [ off | virtual | physical ] >
Nội dung
< / textarea>
ame : tên để xác đònh textarea trong form
rows : số dòng trong textarea
cols : số cột trong textarea
wrap : xác đònh cách xứ lý dữ liệu trước khi gửi
. off : (default ) gửi nội dung văn bản bỏ qua các ký tự xuống dòng
. virtual : cho phép nhập ký tự xuống dòng nhưng không gửi đi
. physical : gửi nội dung văn bản bao gồm cả ký tự xuống dòng
b. Thẻ <input>:
Cung cấp các công cụ giới hạn thông tin phản hồi
Cú pháp :
< input type=”loại input” name=tên value =“nội dung” >
type : xác đònh loại công cụ (checkbox, radio, button …)
name : tên để xác đònh công cụ trong form
value : nội dung của input
17
+ Textbox : cho phép chỉ nhập một dòng văn bản. Đa số các trình duyệt, độ rộng
mặc đònh của trường văn bản là 20 kí tự.
type = “text”
size= kích thước của text box (tính theo số ký tự)
maxlength= số ký tự tối đa được nhập
value = văn bản xuất hiện trong textbox.
+ Password: tương tự như textbox nhưng nội dung nhập được che bằng mặt nạ
(dấu ‘*’).
type = “password”
+ Checkbox : danh sách các tùy chọn
type = “checkbox”
checked : các tùy chọn được chọn lựa mặc đònh
+ Radio button : gom nhóm danh sách các lựa chọn ( chỉ cho phép chọn 1 lựa
chọn mà thôi )
type = “radio”
checked : tùy chọn mặc đònh
Các lựa chọn trong cùng một nhóm sẽ có cùng tên
Ví dụ
< input type=”radio” name=”gioitinh” value = 1 checked > Nam <br>
< input type=”radio” name=”gioitinh” value = 0 > Nu <br>
Gioi tinh : Nam Nu
+ Hidden : truyền ngầm các giá trò đến Web Server & Script ( dùng để xử lý )
type = “ Hidden “
+ Reset button : xóa dữ liệu trong Form
type = “reset”
+ Submit button : gửi dữ liệu từ Form lên Server
type = “ Submit”
c. Thẻ <select>
Dùng để tạo Combo box và ListBox
Cú pháp
< select name=”tên” size =number [multiple]>
<option [selected] value = “giá tri “> lựa chọn </option>
18
…………
</ select >
name : tên đònh danh
size = 1 : COMBOBOX
> 1 : LISTBOX
multiple (size > 1) cho phép lựa chọn nhiều dòng
Lưu ý :
+ Giá trò nhập vào cho Form cần phải được làm cho có hiệu lực trên trình duyệt, bằng
các đoạn mã client Script . Việc kiểm tra giá trò trên trình duyệt có thời gian tác động
nhanh hơn, và giảm bớt sự truyền tải trên server.
+ Chúng ta cần phải xem xét việc kiểm tra giá trò trên server nếu dữ liệu được chèn
vào vào trong một cơ sở dữ liệu.
+ Một tốt cách để kiểm tra giá trò trên Form là sẽ gửi giá trò cho chính Form đó trước,
thay vì nhảy tới một trang khác. Người dùng sẽ nhận được những thông báo lỗi trên
cùng một trang chứa Form. Việc này sẽ khám phá lỗi dễ dàng hơn .
19
IV. Frame
Với frame, chúng có thể trình bày nhiều tài liệu HTML trong cùng cửa sổ trình
duyệt.Mỗi tài liệu HTML đựơc gọi một khung, và mỗi khung độc lập những khung
khác. Mỗi tài liệu có thể cập nhật riêng biệt.
Những sự bất lợi việc sử dụng frame :
. Ngøi phát triển Web phải theo dõi nhiều tài liệu HTML hơn
. Khó khăn để in toàn bộ trang
Frame thích hợp cho các loại giao diện sau :
. Liên kết chỉ mục
. Những thành phần giao diện cố đònh
. Giao diện dạng hình xem ảnh hay tài liệu
Single Page
Table
- Màn hình chỉ xuất hiện một
trang duy nhất
- Có thẻ <BODY>
- Cập nhật 1 vùng ó cập nhật
toàn trang
Master Page ( Frame)
Top.htm
Left.htm
Right.htm
- Màn hình xuất hiện nhiều trang
- Không có thẻ < BODY >
- Cập nhật từng vùng riêng biệt
* Trình bày trang web thông thường
Site Navigation
( Bannner – Logo – Button …)
Section
Navigation
( ảnh hường trên
từng nhóm trang
một )
Content
( nội dung từng trang riêng lẻ
)
Tools
( Công cụ trợ
giúp )
20
* Một trang frame tổng quát có dạng sau :
< html >
< head >
…………
< / head >
< frameset rows = “number | % | * ”
cols = “number | % | * ” >
< frame src=“URL” name = “tên”
scrolling = “yes | no | auto”
noresize
marginwidth = number
marginheight = number >
… … … …
</ frameset>
rows, cols : số dòng, cột trình bày trong một frameset
src : trang htm cần load trong khung
scrolling : có thanh scroll bar hay không
nosize : không cho phép thay đổi kích thước khung
marginwidth : chiều rộng 2 cạnh trên và dưới
marginheight : chiều rộng 2 cạnh trái và phải
a. Từ 1 trang đơn -> frame
Dùng siêu liên kết thông thường trong trang đơn để gọi đến frame
Ví dụ :
<a href = “masterpage.htm” > Master page </a>
b. Từ 1 frame -> trang đơn
Dùng siêu liên kết có thuộc tính TARGET = “_top ”
Ví du :ï
<a href = ”singlepage.htm” TARGET = “_top” > single page </a>
c. Từ 1 vùng ảnh hưởng đến vùng khác
Dùng siêu liên kết có thuộc tính TARGET với giá trò là tên của vùng bò tác
động.
Ví dụ :
<a href = “content.htm” TARGET = fcontent > Trang 2 </a>
21
CHƯƠNG 2 : DHTML
I. JavaScript
1. Cách nhúng các đoạn code vào trong HTML:
Để nhúng các đoạn code vào trong HTML, người ta dùng thẻ <script>
Cú pháp :
<script language=”ngôn ngữ” [src=”tên file”] [runat={server | client}] >
<!
some statements
// >
</script>
Ví dụ :
<html>
<head>
</head>
<body>
<script>
document.write("Hello World!")
</script>
</body>
</html>
script: - chạy trên client browser -> có thể xem code.
- chạy trên server (thông dòch bởi server) .
Vò trí đặt script trong trang HTML :
+ Đặt trong phần header : script sẽ được load trước khi trang web được trình bày.
<html>
<head>
<script>
some statements
</script>
</head>
22
+ Đặt trong phần body : script sẽ được sử dụng để can thiệp vào cách trình bày nội
dung của trang.
<html>
<head>
</head>
<body>
<script>
some statements
</script>
</body>
+ Đặt giữa header và body : tăng tính rõ ràng giữa các đoạn code trong trang HTML,
script sẽ được xử lý trước khi trang được trình bày.
<html>
<head>
</head>
<script>
some statements
</script>
<body>
</body>
</html>
n dấu script:
<script src="URL den file js" language="ten ngon ngu" [RUNAT=[Serve|Client]]>
<!
//code
>
</script>
Cách viết ngắn cho các script chạy trên server.
<%@ Language=JavaScript %>
<HTML>
<HEAD>
<title>example</title>
</HEAD>
<%
//code
23
%>
<BODY>
<P> </P>
</BODY>
</HTML>
Trong một trang web có thể có nhiều đoạn script.
2. Biến :
Biến là một chổ chứa mà chúng ta cần để lưu giữ thông tin. Giá trò của biến có
thể thay đổi trong quá trình thực thi. Người ta tham khảo một biến thông qua tên của
nó.
Javascript khai báo biến thông qua từ khoá var. Biến trong Javascript xác đònh
được kiểu thông qua giá trò được gán cho nó.
Vd:
var a,n,c;
a = ”character” ; //a là kiểu string.
n = 15; //n là kiểu int;
c = 23.3 ; // c là kiểu float.
Một biến được khai báo bên ngoài một thủ tục có thể được truy cập và thay
đổi bởi bất kỳ đoạn Script nào trong trang web mà trong đó nó được khai báo. Một
biến được khai báo bên trong một thủ tục được tạo ra và phá hủy tại mỗi thời điểm
thủ tục được thực hiện. Không có đoạn Script nào bên ngoài mà thủ tục có thể truy
nhập hoặc thay đổi giá trò của biến đó được.
Các kiểu dữ liệu được đònh nghóa sẳn trong JavaScript
Kiểu Ví dụ nghóa
Số nguyên 125
0125
x125
Hệ cơ số 10
Hệ cơ số 8
Hệ cơ số 16
Số thực 1.75
2e3
1.75
2000
Chuỗi “hello”
“135”
24
Boolean true / false
Null var x Không xác đònh kiểu
Lưu ý:
Javascript cho ép kiểu từ.
Chuỗi ->số nguyên: dùng hàm parseInt.
Vd: x=parseInt(“154”) ; //x chứa giá trò 154.
Chuỗi -> số thực: dùng hàm parseFloat
Vd: x=parseFloat(“1.1214”); //x chứa giá trò 1.1214.
Các toán tử thao tác trên biến :
a.Toán tử đại số
Toán tử Công dụng Ví dụ Kết quả
+ Cộng 2+2 4
- Trừ 5-2 3
* Nhân 4*5 20
/ Chia 15/5
5/2
3
2.5
%
Modulo
5%2
10%8
1
2
++ Tăng 1 x=5
x++
x=6
Giảm 1 x=5
x
x=4
b.Toán tử so sánh
Toán tử Công dụng Ví dụ
== So sánh bằng 5==8 trả về false
!= So sánh không bằng 5!=8 trả về true
>
So sánh lớn hơn 5>8 trả về false
< So sánh nhỏ hơn 5<8 trả về true
>=
So sánh lớn hơn hoặc bằng 5>=8 trả về false
<= So sánh nhỏ hơn hoặc bằng 5<=8 trả về true
25
c.Toán tử gán
Toán tử Ví dụ ý nghóa
= x = y Gán giá trò của y sang cho x
+= x+=y x=x+y
-= x-=y x=x-y
*= x*=y x=x*y
/= x/=y x=x/y
%= x%=y x=x%y
d.Toán tử ù Logic
Toán tử Công dụng Ví dụ
&& and x=6
y=3
(x < 10 && y > 1) trả về true
|| or x=6
y=3
(x==5 || y==5) trả về false
! not x=6
y=3
x != y trả về true
e.Toán tử điều kiện :
Toán tử Ví dụ ý nghóa
?: (x > y) ? 1 : 0 If(x>y) return 1;
Else return 0;
f.Toán tử chuỗi
Toán tử Ví dụ ý nghóa
+ x = “Hello ”;
y = “the world!”;
z= x+y;
z=”Hello the world!”
