Slide 1

JavaScript

Slide 2

Introduction to Scripting Scripting Languages are mainly used to build the programming environment in HTML document Make Web pages dynamic and interactive. Some languages : VBScript, JavaScript, Jscript. Browser Includes Scripting Interpreter Choosing a Scripting Language Browser compatibility Programmer familiarity Scripts can be executed on client or the server.

Slide 3

Client Vs. Server Scripting Client Side ScriptingServer Side Scripting Runs on the users computer i.e. Browser interprets the script Runs on the Web server Visible to users if they view the HTML source Not visible to user source Script is client side by defaultNeed to include RUNAT parameter RUNAT =server Reasons to use: Create control event procedures Reasons to use: Access server resources such as databases and hide business logic implementation Dynamic related functions.Database specific functions Data is already available at client- side Functions processed on server completely Subsequent processing has to be dynamically performed. e.g: Form Validation. Results to the client. e.g. Sorted data in combo

Slide 4

What is JavaScript?

Slide 5

Was designed to add interactivity to HTML pages Is a scripting language (a scripting language is a lightweight programming language) JavaScript code is usually embedded directly into HTML pages JavaScript is an interpreted language (means that scripts execute without preliminary compilation)

Slide 6

What can a JavaScript do? JavaScript gives HTML designers a programming Tool JavaScript can put dynamic text into an HTML page JavaScript can react to events JavaScript can read and write HTML elements JavaScript can be used to validate input data JavaScript can be used to detect the visitor's browser JavaScript can be used to create cookies

Slide 7

How and Where Do You Place JavaScript Code?

Slide 8

How to put a JavaScript code into an HTML page? Use the tag (also use the type attribute to define the scripting language) ...

Slide 9

Where Do You Place Scripts? Scripts can be in the either section or section Convention is to place it in the section....

Slide 10 " title="Simple Program: Printing a line of Text in a Web Page A First Program in JavaScript Welcome to JavaScript Programming! " ); // -->">

Simple Program: Printing a line of Text in a Web Page A First Program in JavaScript Welcome to JavaScript Programming! " ); // -->

Slide 16

Simple Program: Printing a line of Text in a Web Page

Slide 17 User will have to click "OK" to proceed > window.alert("sometext"); Confirm box > User will have to click either "OK" or "Cancel to proceed > window.confirm("sometext"); Prompt box > User will have to click either "OK" or "Cancel" to proceed after entering an input value > window.prompt("sometext","defaultvalue");"> User will have to click "OK" to proceed > window.alert("sometext"); Confirm box > User will have to click either "O">

JavaScript Popup Boxes Alert box > User will have to click "OK" to proceed > window.alert("sometext"); Confirm box > User will have to click either "OK" or "Cancel to proceed > window.confirm("sometext"); Prompt box > User will have to click either "OK" or "Cancel" to proceed after entering an input value > window.prompt("sometext","defaultvalue");

Slide 18 Note: If we click on cancel button then it accept NaN.">

Dynamic Welcome Page Note: If we click on cancel button then it accept NaN.

Slide 19

JavaScript Operators JavaScript operators may be classified into the following groups: Arithmetic operator(+,-,*,/,%) Logical operator(&&,||,!) Relational operator(, =,!=) Assignment operator(=,+=,*=,/=,%=) Increment/Decrement operator(++,--) Bitwise operator( >,&,|,^) Conditional operator(?:)

Slide 20

Special Operators new Used for instantiation of objects. e.g: Date today = new Date( ); this used to refer to the current object delete The delete operator is used to delete an object, an object's property or a specified element in an array.

Slide 21

Algorithm Any computing problem can be solved by executing a series of actions in a specific order. A procedure for solving a problem in terms of 1. the actions to be executed, and 2. the order in which the actions are to be executed.Pseudocode Pseudocode is an artificial and informal language that helps programmers develop algorithms.

Slide 22

JavaScript Control structures Control structure in JavaScript, as follows: if Is used to conditionally execute a single block of code if.. else a block of code is executed if the test condition evaluates to a boolean true else another block of code is executed. switch . case switch statement tests an expression against a number of case option executes the statements associated with the first match

Slide 23

JavaScript Control structures while Repetition Statement for Repetition Statement dowhile Repetition Statement switch Multiple-Selection Statement break and continue Statements Labeled break and continue Statements

Slide 24

Labled break stop: { // labeled block for ( var row = 1; row

Labled continue nextRow: // target label of continue statement for ( var row = 1; row

JavaScript: Functions A JavaScript function contains some code that will be executed only by an event or by a call to that function > To keep the browser from executing a script as soon as the page is loaded, you can write your script as a function You may call a function from anywhere within the page (or even from other pages if the function is embedded in an external.js file). Functions can be defined either or section > As a convention, they are typically defined in the section

Slide 27

Example: JavaScript Function // If alert("Hello world!!") below had not been written within a // function, it would have been executed as soon as the page gets loaded. function displaymessage() { alert("Hello World!") // return can also be used in function definition } // return x; // document.writeln(The message is+displaymessage() );

Slide 28

Random Number Generation To generate numbers randomly random() method of Math object is used. Random method always return values between 0 and 1. 0 random()