jsbasics

jsbasics - Lecture JavaScript - Basics Copyright Ellis...

Info iconThis preview shows pages 1–13. Sign up to view the full content.

View Full Document Right Arrow Icon
JS Basics Copyright © Ellis Horowitz 1999-2009 1 Lecture JavaScript - Basics
Background image of page 1

Info iconThis preview has intentionally blurred sections. Sign up to view the full version.

View Full DocumentRight Arrow Icon
JS Basics Copyright © Ellis Horowitz 1999-2009 2 Outline • Basics of JavaScript • Some simple examples • Basics of the language • variables, types, arrays, objects, functions, methods, properties • operators, expressions, strings, and statements
Background image of page 2
JS Basics Copyright © Ellis Horowitz 1999-2009 3 What is JavaScript • JavaScript is a "simple", interpreted, programming language with elementary object- oriented capabilities • JavaScript has two distinct but overlapping systems –client-side JavaScript runs on Web browsers –server-side JavaScript runs on Web servers • Syntactically JavaScript resembles C, C++, and Java • JavaScript was developed by Netscape (formerly called LiveScript)
Background image of page 3

Info iconThis preview has intentionally blurred sections. Sign up to view the full version.

View Full DocumentRight Arrow Icon
JS Basics Copyright © Ellis Horowitz 1999-2009 4 JavaScript is Embedded in HTML <HTML> <HEAD> </HEAD> <BODY> <SCRIPT LANGUAGE="JavaScript"> //the Javascript here produces content for the BODY on loading </SCRIPT> </BODY> </HTML> Deferred Script <HTML> <HEAD> <SCRIPT LANGUAGE="JavaScript"> //the Javascript here creates functions for later use </SCRIPT> </HEAD> <BODY> </BODY></HTML>
Background image of page 4
JS Basics Copyright © Ellis Horowitz 1999-2009 5 A Simple Example <HTML> <HEAD> <TITLE>Simple Javascript</TITLE> </HEAD> <BODY> <H1>First Example of JavaScript</H1> <SCRIPT LANGUAGE="JavaScript"> <!-- hide from old browsers by embedding in a comment document.write("Last updated on " + document.lastModified + ". ") // end script hiding --> </SCRIPT> </BODY> </HTML>
Background image of page 5

Info iconThis preview has intentionally blurred sections. Sign up to view the full version.

View Full DocumentRight Arrow Icon
JS Basics Copyright © Ellis Horowitz 1999-2009 6 Example 1: Browser Output
Background image of page 6
JS Basics Copyright © Ellis Horowitz 1999-2009 7 Another Example <HTML> <HEAD><TITLE>Computing Factorials</TITLE></HEAD> <BODY> <H1>Another Example of JavaScript</H1> <SCRIPT LANGUAGE="JavaScript"> document.write("<H1>Factorial Table</H1>"); for ( i = 1, fact = 1; i < 10; i++, fact = fact * i) { document.write(i + "! = " + fact); document.write("<BR>"); } </SCRIPT> </BODY> </HTML>
Background image of page 7

Info iconThis preview has intentionally blurred sections. Sign up to view the full version.

View Full DocumentRight Arrow Icon
JS Basics Copyright © Ellis Horowitz 1999-2009 8 Example 2: Browser Output
Background image of page 8
JS Basics Copyright © Ellis Horowitz 1999-2009 9 JavaScript has Event Handlers <HTML> <HEAD><TITLE>Handling Events Example</TITLE></ HEAD> <BODY> <H1>Handling Events in JavaScript</H1> <FORM> <INPUT TYPE="button" VALUE="Click me" onClick="alert(‘You clicked me’)" > </FORM> </BODY> </HTML>
Background image of page 9

Info iconThis preview has intentionally blurred sections. Sign up to view the full version.

View Full DocumentRight Arrow Icon
JS Basics Copyright © Ellis Horowitz 1999-2009 10 Example 3: Browser Output
Background image of page 10
JS Basics Copyright © Ellis Horowitz 1999-2009 11 Event Handlers Browser Object HTML tags Event handlers area map, area onClick, onMouseOut onMouseOver Frame frameset onLoad, onUnLoad Image img onAbort, onError onLoad Link a onClick, onMouseOut onMouseOver Window body onBlur, onError onFocus, onLoad onUnLoad Form form onReset, onSubmit Form elements input, onClick, onChange select onFocus, onblur
Background image of page 11

Info iconThis preview has intentionally blurred sections. Sign up to view the full version.

View Full DocumentRight Arrow Icon
Copyright © Ellis Horowitz 1999-2009 12 Firefox JavaScript Console In Firefox, select Tools - Error (formerly JavaScript) Console. Firefox
Background image of page 12
Image of page 13
This is the end of the preview. Sign up to access the rest of the document.

This note was uploaded on 02/24/2011 for the course CSCI 571 at USC.

Page1 / 85

jsbasics - Lecture JavaScript - Basics Copyright Ellis...

This preview shows document pages 1 - 13. Sign up to view the full document.

View Full Document Right Arrow Icon
Ask a homework question - tutors are online