Bài giảng Computer Networks 1 (Mạng máy tính 1) - Lecture 10: Application Layer (Cont’) - Phạm Trần Vũ

Computer Networks 1  
(Mng Máy Tính 1)  
Lectured by: Dr. Phm Trn Vũ  
MEng. Nguyn Cao Đạt  
1
Lecture 10:  
Application Layer (con’t)  
Reference:  
Chapter 7 - “Computer Networks”,  
Andrew S. Tanenbaum, 4th Edition, Prentice  
Hall, 2003.  
2
Outline  
HTML- HyperText Markup Language  
Dynamic Web Documents  
Client-Si
Server-Side Dynamic Web Page  
3
HTML – HyperText Markup Language  
(a) The HTML for a sample Web page. (b) The  
formatted page.  
(b)  
4
HTML Tags  
5
Tables  
(a) An HTML table.  
(b) A possible rendition  
of this table.  
Forms  
(a) The HTML for an  
order form.  
(b) The formatted page.  
(b)  
7
Forms (2)  
Basic structure  
<FORM ACTION=“file" METHOD={GET|POST}>  
[<INPUT TYPE=“” NAME=“” VALUE="">]+  
</FORM>  
Input types  
TEXT  
<INPUT [TYPE=TEXT] NAME="text-id" [SIZE=nn]  
[MAXLENGTH=nn] [VALUE="default text"]>  
8
Forms (3)  
Input types (cont.)  
SUBMIT  
<INPUT TYPE=SUBMIT [NAME="button-id"]  
[VALUE="text"]>  
RESET  
<INPUT TYPE=RESET [VALUE=“text"]>  
BUTTON  
<INPUT TYPE=BUTTON [NAME="button-id “]  
[VALUE="text"]>  
9
Forms (4)  
Input types (cont.)  
RADIO  
<INPUT TYPE=RADIO NAME="radio-set-id" VALUE="choice-id" [checked]>  
Ex:  
<input type=>Option 1  
<br><input type="radio" value="V2" name="R1">Option 2  
<br><input type="radio" value="V3" name="R1">Option 3  
CHECKBOX  
<INPUT TYPE=CHECKBOX NAME="id“ VALUE="choice-id" [CHECKED]>  
Ex:  
<input type="checkbox" name="C1“ value="ON">Check 1 <br>  
<input type="checkbox" name="C2" value="ON" checked>Check 2  
10  
Forms (4)  
Input types (cont.)  
HIDDEN  
<INPUT TYPE=HIDDEN NAME="id" VALUE="data">  
TEXTAREA  
<TEXTAREA NAME="id" [COLS=nn] [ROWS=nn]>default  
text</TEXTAREA>  
SELECT  
<SELECT NAME="id" [SIZE=nn] [MULTIPLE]>  
[<OPTION [VALUE=“value"] [SELECTED]>text ]+  
</SELECT>  
11  
Dynamic Web Documents  
Web contents are generated dynamically on  
demand  
Dynamic Wow popular  
in the Internet  
Dynamic contents can be generated on  
client side or/and server side  
12  
Dynamic Web Page Generation  
13  
Dynamic Web Page Generation  
(2)  
(a) Server-side scripting with PHP.  
(b) Client-side scripting with Javascript.  
14  
Client-Side Dynamic Web Page  
Generation with Javascript  
Javascript code  
<script language=“JavaScript”>  
[var variable;]*  
function fu
//commands;  
[return [value];]  
}
</script>  
Using existed Javascript file (*.js)  
<script language="JavaScript" src="*.js"></script>  
15  
Client-Side Dynamic Web Page  
Generation with Javascript (2)  
Use of JavaScript  
for processing  
a form.  
Client-Side Dynamic Web Page Generation  
with Javascript (3)  
A JavaScript program for computing and printing factorials.  
17  
Client-Side Dynamic Web Page Generation  
with Javascript (4)  
An interactive Web page that responds to mouse  
movement.  
18  
Client-Side Dynamic Web Page Generation  
with Javascript (5)  
function isEmail() {  
if (document.forms[0].elements[1].value == '') {  
alert ("\n The E-Mail field is blank. \n\n “+  
“Please enter your E-Mail address.")  
document.forms[0].elements[1].focus();  
return false;  
}
if (document.forms[0].elements[1].value.indexOf ('@',0) == -1 ||  
document.forms[0].elements[1].value.indexOf ('.',0) == -1) {  
alert ("\n The E-Mail field requires a \"@\" and a \".\""+  
"be used. \n\nPlease re-enter your E-Mail address.")  
document.forms[0].elements[1].select();  
document.forms[0].elements[1].focus();  
return false;  
}
return true;  
}
19  
Client-Side Dynamic Web Page Generation  
with Java Applet  
//file SampleApplet.java  
import java.applet.*; import java.awt.*;  
public class SampleApplet extends Applet {  
String text = "error"; int x = 0; int y = 20;  
public void init() {  
text = getParameter("text");  
try { x = Integer.parseInt(getParameter("x"));  
y = Integer.parseInt(getParameter("y"));  
}catch(NumberFormatException ex){ }  
}
public void paint(Graphics g) {  
g.setFont.BOLD+  
Font.ITALIC,36));  
g.drawString(text,x,y);  
}
20  
}
Tải về để xem bản đầy đủ
pdf 43 trang yennguyen 12/04/2022 21580
Bạn đang xem 20 trang mẫu của tài liệu "Bài giảng Computer Networks 1 (Mạng máy tính 1) - Lecture 10: Application Layer (Cont’) - Phạm Trần Vũ", để tải tài liệu gốc về máy hãy click vào nút Download ở trên

File đính kèm:

  • pdfbai_giang_computer_networks_1_mang_may_tinh_1_lecture_10_app.pdf