Manju Muralidharan Priya. CS4PM Web Aesthetics and Development WEEK 12

Transcription

1 CS4PM Web Aesthetics and Development WEEK 12 Objective: 1. Understand the basic operations in JavaScript 2. Understand and Prepare a 3 page Website (Homework for Week 15) 3. Finish Quiz 2 Outline: a. Basics of Jscript Conditions b. Jscript Loops c. Jscript Switch case d. Talk about Homework, and what to do in it. Reading: Refer to w3schools websites and use the TRY IT YOURSELF editor and play with different Javascript syntax. Refer to textbook to prepare a 3 Page Website with HTML,CSS and Jscript. CS4PM Week 12 Page 1 of 6

2 Conditional Statements Conditional statements are used to perform different actions based on different conditions. Very often when you write code, you want to perform different actions for different decisions. You can use conditional statements in your code to do this. In JavaScript we have the following conditional statements: o if statement - use this statement to execute some code only if a specified condition is true o if...else statement - use this statement to execute some code if the condition is true and another code if the condition is false o if...else if...else statement - use this statement to select one of many blocks of code to be executed o switch statement - use this statement to select one of many blocks of code to be executed If Statement Use the if statement to execute some code only if a specified condition is true. if (condition) code to be executed if condition is true 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 If...else if...else Statement Use the if...else if...else statement to select one of several blocks of code to be executed. CS4PM Week 12 Page 2 of 6

3 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 The JavaScript Switch Statement Use the switch statement to select one of many blocks of code to be executed. 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 First we have a single expression n (most often a variable), that is evaluated once. The value of the expression is then compared with the values for each case in the structure. If there is a match, the block of code associated with that case is executed. Use break to prevent the code from running into the next case automatically. Use the default keyword to specify what to do if there is no match: 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 CS4PM Week 12 Page 3 of 6

4 do/while - also loops through a block of code while a specified condition is true The For Loop The for loop is often the tool you will use when you want to create a loop. The for loop has the following syntax: for (statement 1; statement 2; statement 3) the code block to be executed Statement 1 is executed before the loop (the code block) starts. Statement 2 defines the condition for running the loop (the code block). Statement 3 is executed each time after the loop (the code block) has been executed. The While Loop The while loop loops through a block of code as long as a specified condition is true. The break statement "jumps out" of a loop. The continue statement "jumps over" one iteration in the loop. The Break Statement You have already seen the break statement used in an earlier chapter of this tutorial. It was used to "jump out" of a switch() statement. The break statement can also be used to jump out of a loop. The break statement breaks the loop and continues executing the code after the loop The Continue Statement The continue statement breaks one iteration (in the loop), if a specified condition occurs, and continues with the next iteration in the loop. CS4PM Week 12 Page 4 of 6

5 CS4PM QUIZ 2 Total possible points 50 Total Time 45 mins 1. What are the two best quality audio formats? Which one would you choose if you need a smaller web site (size-wise) and why? (10 points) 2. Explain (max. 100 words) with a few examples how the use of audio enhances a web site. (10 points) 3. What are the three steps in web page design? List the uses and advantages of web templates. (5 points) 4. Explain the types of page layout design. Could you give examples of web sites where you have observed each type of design? (10 points) 5. Explain (max. 100 words) with a few examples the relative merits and de-merits of static and dynamic page layouts. (10 points) 6. Explain the syntax of CSS and the three ways to insert CSS with example. (5 points) CS4PM Week 12 Page 5 of 6

6 Explanation of Home Work Homework give: To create a 3 Page Website for a client of your choice This time is included for the students to clear their doubts on the various topics needed for creating the website. To Submit o A Website Planning Diagram o A Report on the pages used o External css file o HTML Files o Jscript files (if used) o Report defending your project, for why it deserves extra credit. CS4PM Week 12 Page 6 of 6