Presentation is loading. Please wait.

Presentation is loading. Please wait.

Objective Static vs. Dynamic Web pages. Variables. Assignments. JavaScript Hierarchy of Objects JavaScript Functions (prompt(“”,””) Document.write(“”)

Similar presentations


Presentation on theme: "Objective Static vs. Dynamic Web pages. Variables. Assignments. JavaScript Hierarchy of Objects JavaScript Functions (prompt(“”,””) Document.write(“”)"— Presentation transcript:

1

2 Objective Static vs. Dynamic Web pages. Variables. Assignments. JavaScript Hierarchy of Objects JavaScript Functions (prompt(“”,””) Document.write(“”) Alert(“”) document.bgColor document.fgColor document.linkColor document.vlinkColor, window.open() window.close() window.location confirm() window.moveBy()

3 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….

4 Dynamic Web pages Properties; They are the pages that change while you are looking to them, Varying their contents and responding to user actions.

5 Variables A variable is a 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, Illegal variables: 2hotforU, salary$, two word,

6 Assignments = is the assignment Operator. 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;

7 Cont.. 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.

8 JavaScript A 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, changing the value of an variable. JavaScript is a 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 tags.

9 Cont.. How to insert javascript in a webpage; Use the HTML tag pair and : alert(" your message goes here ");

10 JavaScript page Greetings hello Word, this is the html part of web page. JavaScript statments will go in here

11 Greetings firstName = prompt("Please enter your name", ""); document.write(" Hello " + firstName + ", welcome to my Web page. "); Whatever else you want to appear in your Web page...

12 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”, “”)

13 Alert(“….”) Creats a pop-up window Alert statement cause a new windows to appear and display a specified message Such as: alert(" your message goes here ");

14

15 Prompt(“Some text”, ” ”) 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(“Please enter your name”, “”);

16

17 Document.write(“”) Document.write(“ ”) statement is used to display a message within the web page. document.write (“ ”) statement can display text ( a string) or a combination of text and variables connected with ‘+’. Documet.write(“hello class core 13.12”);

18 Formating output Any string in a document.write statement includes html tags will display just as any other text. document.write(" Hello "+ firstName + ", welcome to my Web page. ”) In general, JavaScript treats any sequence of characters enclosed in quotes as literal text.

19 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”

20 Number Representation JavaScript automatically displays very large or very small values using scientific notation. Example 100000 would be 1e5, X*10 y =XeY

21 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.

22 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.

23 Hierarchy of Objects Objects follow a strict hierarchy where the window object is the very top level. Such as: window.alert() Because window is the top level object it can be omitted. alert(); The second level of object is window.document such as: document.write(), document.bgcolor, etc..

24 Cont.. alert() Prompt() Confirm(). bgColor, fgColor, linkColor vlinkColor Window document

25 document.bgColor and document.fgColor document.bgColor is for changing the background color of page document.fgColor is for changing the font color of page Example background and font color This can be annoying... document.bgColor=“red”; document.fgColor=“blue”;

26 document.linkColor and document.vlinkColor document.linkColor is for changing the color of unvisited hyper links document.vlinkColor is for changing the color of visited links Example link color This can be annoying... document.linkColor=“red”; document.vlinkColor=“blue”;

27 window.open() and window.close() window.open() is for opening anew window window.close() is for closing a window example open and close window window.open(“www.google.com); window.close();

28 window.location window.location is for changing the location of a window example html> Look at the location on top! newpage=prompt("Enter a URL“,"http://www.yahoo.com"); window.location=newpage;

29 Confirm() Confirm() is a method that produce dialog boxes when called It is used to get user confirmation from a dialog box containing an OK button that returns true to the script and a cancel button that returns false to the script

30 Cont.. ask= confirm(“do you want to open a new window?”); If (ask){ window.open(); } Else{ Alert(“you chose to not open a new window”); }

31 window.moveBy() window.moveBy() is for moving a window either horizontally, vertically, or both, by the specified amount in pixels Did the page just move? answer = confirm("Are you ready?"); if (answer) { window.moveBy(100,100); }

32 Thank You..


Download ppt "Objective Static vs. Dynamic Web pages. Variables. Assignments. JavaScript Hierarchy of Objects JavaScript Functions (prompt(“”,””) Document.write(“”)"

Similar presentations


Ads by Google