Web Technology

Krishna Bhati
Agenda

2
 JavaScript – Date Object
• The Date object is used to work with dates and times.
• Examples
• Date() - returns today’s date.
• getFullYear() - returns current full year.
• getTime() - returns the number of milliseconds since 01.01.1970.
• setFullYear() - sets a specific date.
• toUTCString() - converts today's date (according to UTC) to a string.
• getDay() - returns a weekday as a number.
• 0-Sunday
• 1-Monday
• 2-Tuesday..

3
 Array
• A normal variable can only hold one piece of
data at a time, the Array object let's you store
multiple values in a single variable.
• An array can hold all your variable values
under a single name. And you can access the
values by referring to the array name.
• Each element in the array has its own ID so
that it can be easily accessed.

4
 Creating Array
• An array can be created in three ways.
The following code creates an Array object called LanguagesKnown
1: Regular:
var LanguagesKnown=new Array(); 
LanguagesKnown[0]=“English";       
LanguagesKnown[1]=“Gujarati";
LanguagesKnown[2]=“Hindi";
2: Condensed:
var LanguagesKnown=new Array(“English”, ”Gujarati”, ”Hindi “);
3: Literal:
var LanguagesKnown=[“English",”Gujarati",”Hindi”];
If you specify numbers or true/false values inside the array then
the variable type will be Number or Boolean, instead of String
index values start at 0 and not 1

5
You Can Have Different Objects in One Array

• All JavaScript variables are objects. Array elements

6
 Array Functions
1. Remove the first element of an array and returns
that element – shift()
2. Select part of array and returns the new array
– slice()
– The slice() method selects the elements starting at the
given start argument, and ends at, but does not include,
the given end argument
3. Sort an element of array – sort()
4. To add items at the beginning of an array use, the
unshift() method.
7
 String Manipulation
• Strings can be created in two ways
in javascript:
1.   var str=”MSU”;  //primitive string type
2.   var str=new String(“MSU”);  //string object 
• JavaScript imposes no practical limit on the
number of characters that a string can hold.
• Most old browsers have a limit of 255
characters.
8
 String Manipulation
• The length property of the String object to find the length of a string:
var txt="Hello world!";
document.write(txt.length);
The code above will result in the following output:
12
var txt="Hello world!";
document.write(txt.toUpperCase());
document.write(txt.toLowerCase());
The code above will result in the following output:
HELLO WORLD!
hello world!

9
 Event Handling
• Events are actions that can be detected by Javascript.
• An event handler executes a segment of a code based on certain
events occurring within the application, such as onLoad, onClick.
• JavaScript event handlers can be divided into two parts:
interactive event handlers and non-interactive event handlers.
• An interactive event handler is the one that depends on the user
interactivity with the form or the document.
• E.g. onMouseOver ( it depends on the users action with the
mouse. )
• Non-interactive event handler would be onLoad, because this
event handler would automatically execute JavaScript code
without the user's interactivity.

10
 Attribute Trigger
onabort Loading of image was interrupted
onblur Element loses focus
onchange Element gets modified
onclick Element gets clicked
ondblclick Element gets double clicked
onerror An error occurred loading an element
onfocus An element received focus
onkeydown A key was pressed when an element has focus
onkeypress A keystroke was received by the element
onkeyup A key was released when the element has focus
onload An element was loaded
onmousedown The mouse button was pressed on the element
onmousemove The mouse pointer moves while inside the element
onmouseout The mouse pointer was moved outside the element
onmouseover The mouse pointer was moved onto the element
onmouseup The mouse button was released on the element.
onreset The form's reset button was clicked
onresize The containing window or frame was resized
onselect Text within the element was selected
onsubmit A form is being submitted
onunload The content is being unloaded (e.g. window being closed)
onscroll The user scrolls (in any direction and with any means). 11
 Event Handling Examples
• onLoad and onUnload- The onLoad and onUnload events
are triggered when the user enters or leaves the page. An
onLoad event occurs when a window or image finishes
loading. For windows, this Event Handler is specified in the
<BODY> attribute of the window.
• onClick-In an onClick Event Handler, JavaScript function is
called when an object in a button (regular, radio, reset and
submit) is clicked, a link is pushed, a checkbox is checked
or an image map area is selected.
• onBlur - An onBlur Event Handler executes JavaScript code
when input focus leaves the field of a text, textarea, or a
select option. For windows, frames and framesets the
Event Handler executes JavaScript code when the window
loses focus. 12
 Event Handling Examples
• onChange -Event Handler executes JavaScript code when
input focus exits the field after the user modifies its text.
• Note: The onBlur event is fired when you have moved
away from an object without necessarily having changed
its value.The onChange event is only called when you
have changed the value of the field.
• onFocus Event Handler executes JavaScript code when
input focus enters the field either by tabbing in or by
clicking but not selecting input from the field.
• onMouseOut: JavaScript code is called when the mouse
leaves a specific link or an object or area from outside
that object or area. For area object the Event Handler is
specified with the <AREA> tag.
13
 Event Handling Examples
• onMouseOver:JavaScript code is called when the mouse is
placed over a specific link or an object or area from outside
that object or area. For area object the Event Handler is
specified with the <AREA> tag.
• onReset Event Handler executes JavaScript code when the
user resets a form by clicking on the reset button.
• onSelect- Event Handler executes JavaScript code when the
user selects some of the text within a text or textarea field.
• onSubmit -Event Handler calls JavaScript code when the
form is submitted.

14
THANK YOU

15