22
Chapter 4 JavaScript and Dynamic Web pages
| Date post: | 16-Jan-2016 |
| Category: |
Documents |
| Upload: | eugenia-kennedy |
| View: | 238 times |
| Download: | 0 times |
Chapter 4JavaScript and Dynamic Web
pages
Objectives• Static Web pages
• Dynamic Web pages
• JavaScript
• Variables
• Assignments.
• JavaScript Functions – (prompt(“”,””)– Document.write(“”)– Alert(“”)
Static Web Pages
• Looks the same and behave in the same manner each time they are loaded into a browser
• Content doesn’t change
• It doesn’t specifying dynamic behavior– Example html pages.
A programming language is needed….
Dynamic Web pages
• Properties;– They are the pages that change while you
are looking to them,– Varying their contents and responding to
your actions.
Variables• A variable is name used to symbolize a
dynamic value.
• A variable can be used to represent a value.
• JavaScript variables:– tempInFahr, X, Y, x, y, Sum, SUM, sum,
Sum2Date,
Not variables:
2hotforU, salary$, two word,
Assigments
• = is the assignment statement.
• The value on the right side assigned to the variable on the left side.x = y+1;
myName = john,
myname= Jan.
Y= 1;
Y= 3;
• X = X +1– The current value of X is increased by 1, and
the result is assigned back to x.
• Note; = is assignment operator.
== is equality operator.
JavaScript• Each Statement in a programming language
specifies a particular action that the computer is to carry out, such as changing an image, opening a new window.
• JavaScript is simple programming language that adding dynamic features to Web pages.
• How?– the simplest way to add dynamic content to a Web
page is to embed Java Script statements directly within the page using <script> tags.
• How to insert javascript in a webpage;
• Use the HTML tag pair <script> and </script> :
• <script language="JavaScript" type="text/javascript>
alert(" your message goes here ");
</script>
<html><!-- =============================================== -->
<head> <title> Greetings </title> </head>
<body><p>
hello Word, I like javascrip.</p> <script type="text/javascript">……………………..……………………………………………..………………….</script>
</body></html>
• <html>• <!-- greet.html Dave Reed -->• <!-- Web page that displays a personalized greeting. -->• <!-- =============================================== -->
• <head>• <title> Greetings </title>• </head>
• <body>• <script type="text/javascript">• firstName = prompt("Please enter your name", "");
• document.write("<p>Hello " + firstName + ", welcome to my Web page.</p>");• </script>
• <p>• Whatever else you want to appear in your Web page...• </p>• </body>• </html>
A function Or Subroutine
• Take some variables, evaluate this variables and produce an output.– Example; F(x)=x+2, alert(“hello cc312”),
prompt(“what is your name”, “”)
Alert(“….”)
• For creating a pop-up window
• Alert statement cause a new windows to appear and display a specified message
• Such as:– alert(" your message goes here ");
Prompt(“Some text”,””)
• When prompting the user for a value, the programmer can specify ( a string of characters enclosed in quotes) that serve as prompt message, followed by another string that specifies a default value for the prompt.
Prompt(“my name is”, “”);
Document.write(“”)
• Document.write(() statement is used to display a message within the web page. Write statement can display text ( a string) or a combination of text and variables connected with ‘+’.
Documet.write(“hello class cc3.12”);
Formating output
• Any sting in a write statement includes html tags will display just as any other text.– document.write("<p>Hello <i>"+ firstName +
"</i>, welcome to my Web page.</p>“
• In general, JavaScript treats any sequence of characters enclosed in quotes as literal text.
Data types
• Integers – They are numbers, such as 1,2,3,4…
• Booleans;– True or False values
• Strings;– They are sequins of any kinds of data types.
Such as “Brooklyn college”, “cc312”, this is 4 you”
Number Representation
• JavaScript automatically displays very large or very small values using scientific notation. – Example 100000 would be 1e5, X*10y =XeY
Programming errors and Debugging
• Bug refers to an error in a program• Debugging is the process of systematically
locating and fixing errors in aprogram• Three types errors can occur in a program:
1. Syntax errors are simple typographic errors.
2. Run-time errors occur when operations are applied to illegal values, such as dividing by 0.
3. Logic errors represent flaws in the design or implementation of program.
Math library functions
• Math.sqrt() returns a square root of the input.• Math.max (X,Y) returns the greater of the two
inputs.• Math.min(X,Y) returns the minimum number.• Math.floor(2.564) returns floor of a number, in
this example it will return 2.Math.ceil(2.564) returns ceil of a number, in here it would return 3.
