JavaScript - A Web Script Language Fred Durao

Overview of JavaScript JavaScript is primarily used in the client-side, implemented as part of a web browser in order to provide enhanced user interfaces and dynamic websites. - Originally developed by Netscape and Sun in 1995; - We’ll call collections of JavaScript code scripts, not programs; The primary use of JavaScript is to write functions that are embedded in or included from HTML pages.

Examples of JavaScript (2) Some simple examples of this usage are: Validating input values of a web form to make sure that they are acceptable before being submitted to the server. EXAMPLE: example.html Opening or popping up a new window with programmatic control over the size, position, and attributes of the new window. EXAMPLE: Changing images as the mouse cursor moves over them: This effect is often used to draw the user's attention to important links displayed as graphical elements. EXAMPLE:

General Syntactic Characteristics JavaScript scripts ARE embedded in HTML documents in the HEAD of HTML. - Either directly, as in -- JavaScript script code– - Or indirectly, as a file specified in the src attribute of, as in - Scripts are usually hidden (i.e. have no effect) by putting them in special comments <!-- -- 

Screen Output & Keyboard Input - The JavaScript model for the HTML document is the Document object - The model for the browser display window is the Window object - The Window object has two properties, document and window, which refer to the Document and Window objects, respectively - The Document object has a method, write, which dynamically creates content e.g., document.write("Answer: " + result + " "); - The parameter is sent to the browser, so it can be anything that can appear in an HTML document (, but not \n ) - The Window object has three methods for creating dialog boxes, alert, confirm, and prompt

Screen Output (continued) 1. alert("Hej! \n"); - Opens a dialog box which displays the parameter string and an OK button - It waits for the user to press the OK button 2. confirm("Do you want to continue?"); - Opens a dialog box and displays the parameter and two buttons, OK and Cancel 3. prompt("What is your name?", ""); - Opens a dialog box and displays its string parameter, along with a text box and two buttons, OK and Cancel Examples:

Functions A function contains java script code that will be executed by an event or by a call to the function. In general, we place all functions in the head of the the XHTML document Functions are declared as such: function function_name ( parameter1, parameter2, … ) { -- java script code – } OBS: parameters are optional! EXAMPLE: function display_Message(){ alert("Hello World!"); }

Calling Functions A functions are called from event attributes in HTML tags. EXAMPLE: function display_Message(){ alert("Hello World!"); } Example:

Calling Functions from HTML Event Attributes HTML added the ability to let events trigger actions in a browser, like starting a JavaScript when a user clicks on an element. EXAMPLE FOR MOUSE EVENTS: See complete list at:

Javascript Reference Tutorial: Examples: Validation: