YOMEDIA
Web engineering: Lecture 17, 18 - Majid Mumtaz
Chia sẻ: You You
| Ngày:
| Loại File: PDF
| Số trang:31
63
lượt xem
4
download
Download
Vui lòng tải xuống để xem tài liệu đầy đủ
This lecture introduce JavaScript Statements. In JavaScript we have the following conditional statements, that is If statement, if...else statement, if...else if...else statement, and switch statement. In this lecture, we will learn this four statements.
AMBIENT/
Chủ đề:
Nội dung Text: Web engineering: Lecture 17, 18 - Majid Mumtaz
- Web Engineering
Lecture 17-18
MAJID MUMTAZ
Department of Computer Science, CIIT Wah
1
- JavaScript Statements
• In JavaScript we have the following conditional
statements:
– if statement - use this statement to execute some
code only if a specified condition is true
– if...else statement - use this statement to execute
some code if the condition is true and another code if
the condition is false
– if...else if....else statement - use this statement to
select one of many blocks of code to be executed
– switch statement - use this statement to select one of
many blocks of code to be executed
2
- JavaScript Statements
• If Statement
if (condition)
{
code to be executed if condition is true
}
• Example
if (time
- JavaScript Statements
• If...else Statement: Use the if....else statement to execute some code if a
condition is true and another code if the condition is not true.
– if (condition)
{
code to be executed if condition is true
}
else
{
code to be executed if condition is not true
}
Example:
if (time
- JavaScript Statements
• If...else if...else Statement: Use the if....else if...else
statement to select one of several blocks of code to be
executed.
– if (condition1)
{
code to be executed if condition1 is true
}
else if (condition2)
{
code to be executed if condition2 is true
}
else
{
code to be executed if neither condition1 nor condition2 is true
}
5
- JavaScript Statements
• The JavaScript Switch Statement :Use the switch statement to select one
of many blocks of code to be executed.
Syntax:
switch(n)
{
case 1:
execute code block 1
break;
case 2:
execute code block 2
break;
default:
code to be executed if n is different from case 1 and 2
}
• Home work:
– Display today's weekday-name. Note that Sunday=0, Monday=1, Tuesday=2,
etc:
6
- JavaScript Loops
• Loops can execute a block of code a number of
times.
• Different Kinds of Loops: JavaScript supports
different kinds of loops:
– for - loops through a block of code a number of times
– for/in - loops through the properties of an object
– while - loops through a block of code while a specified
condition is true
– do/while - also loops through a block of code while a
specified condition is true
7
- The For Loop
• The for loop has the following syntax:
for (initialization; condition; Increment/decrement)
{
the code block to be executed
}
8
- The For/In Loop
• The JavaScript for/in statement loops through the properties of an
object:
Syntax
for(var property_name in object){
statements;
}
Example:
var txt="";
var person={Fname:“Ali“, Lname:“khan", age:25};
for (var x in person)
{
txt=txt + person[x];
}
Document.write(” ” + txt); // Alikhan25
9
- JavaScript While Loop
• Loops can execute a block of code as long as a specified
condition is true.
• Syntax
while (condition)
{
code block to be executed
}
Example:
var i =0;
while (i
- The Do/While Loop
• The do/while loop is a variant of the while loop. This loop will
execute the code block once, before checking if the condition is
true, then it will repeat the loop as long as the condition is true.
• Syntax
do
{
code block to be executed
}
while (condition);
Example
do
{
document.write ("The number is " + i + "“);
i++;
}
while (i
- Home work
• Create a for loop that displays numbers as: 10
9 8 7 6 5 4 3 2 1. Put the numbers in HTML
table cells.
• Repeat same task using while loop
• JavaScript dialog Boxes
– Alert box
– Confirm box
– Prompt box
12
- JavaScript Break and Continue
• The break statement "jumps out" of a loop.
• The continue statement "jumps over" one iteration in the
loop. E.g.
Examples:
1. for (i=0;i
- JavaScript Errors
• The try statement lets you test a block of code
for errors.
• The catch statement lets you handle the error.
• The throw statement lets you create custom
errors.
14
- JavaScript Errors
• JavaScript try and catch:
var txt="";
– Syntax
function message()
{
try
try {
adddlert("Welcome guest!");
{ }
catch(err)
{
//Run some code here txt="There was an error on this page.\n\n";
txt+="Error description: " + err.message +
} "\n\n";
txt+="Click OK to continue.\n\n";
catch(err) alert(txt);
}
{ }
//Handle errors here
}
15
- The HTML DOM (Document Object
Model)
• When a web page is loaded, the browser
creates a Document Object Model of the
page.
• The HTML DOM model is constructed as a
tree of Objects:
16
- What is the DOM?
• The DOM is a W3C (World Wide Web
Consortium) standard.
• The DOM defines a standard for accessing
documents:
• "The W3C Document Object Model (DOM) is a
platform and language-neutral interface that
allows programs and scripts to dynamically
access and update the content, structure, and
style of a document."
• Core DOM, XML DOM, HTML DOM
17
- What is the HTML DOM?
• The HTML DOM is a standard object model
and programming interface for HTML. It
defines:
– The HTML elements as objects
– The properties of all HTML elements
– The methods to access all HTML elements
– The events for all HTML elements
18
- HTML DOM Methods
• HTML DOM methods are actions you can perform (on HTML Elements)
• HTML DOM properties are values (of HTML Elements) that you can set or
change
Example:
Hello World!
var txt= document.getElementById("intro").innerHTML;
document.write(txt);
Note: getElementById is a method, while innerHTML is a property.
19
- Finding HTML Elements
• Often, with JavaScript, you want to manipulate HTML
elements.
• To do so, you have to find the elements first. There are a
couple of ways to do this:
– Finding HTML elements by id
– Finding HTML elements by tag name
– Finding HTML elements by class name
– Finding HTML elements by HTML object collections
• Examples
– var x=document.getElementById("intro");
– var x=document.getElementById("main");
var y=x.getElementsByTagName("p");
– document.getElementsByClassName("intro");
20
Thêm tài liệu vào bộ sưu tập có sẵn:
Báo xấu
LAVA
ERROR:connection to 10.20.1.100:9315 failed (errno=111, msg=Connection refused)
ERROR:connection to 10.20.1.100:9315 failed (errno=111, msg=Connection refused)
Đang xử lý...
Thêm vào BST
Báo xấu
