JS Events Methods Objects

JAVASCRIPT OBJECTS
Objects are composed of attributes.

If an attribute contains a function, it is
considered to be a method of the object
otherwise, the attribute is considered a
property.
Object Properties
Object properties can be any of the three
primitive data types, or any of the abstract
data types, such as another object.
Object properties are usually variables that
are used internally in the object's methods,
but can also be globally visible variables
that are used throughout the page.
The syntax for adding a property to an

object is
objectName.objectProperty = propertyValue;
Example:
var str = document.title;
Object Methods
The methods are functions that let the object
do something or let something be done to it.
There is little difference between a function
and a method, except that a function is a
standalone unit of statements and a method
is attached to an object and can be
referenced by the this keyword.
Methods are useful for everything from

displaying the contents of the object to the
screen to performing complex mathematical
operations on a group of local properties
and parameters.
Example:document.write("This is test");
User-Defined Objects:
All user-defined objects and built-in objects
are descendants of an object called Object.
The new Operator:
The new operator is used to create an
instance of an object.
To create an object, the new operator is
followed by the constructor method.
In the following example, the constructor

methods are Object(), Array(), and Date().
These constructors are built-in JavaScript
functions.
var employee = new Object();

var books = new Array("C++", "Perl", "Java");
var day = new Date("August 15, 1947");
The Object() Constructor:

A constructor is a function that creates and
initializes an object.
JavaScript provides a special constructor
function called Object() to build the object.
The return value of the Object() constructor
is assigned to a variable.
Example 1:
<html>
<head>
<title>User-defined objects</title>
<script type="text/javascript">
var book = new Object();
// Create the object
book.subject = "Perl";
// Assign properties to the object
book.author ="Mohtashim";
</script>
</head>
<body>
document.write("Book name is : " + book.subject + "<br>");
document.write("Book author is : " + book.author + "<br>");
</script>
</body>
</html>
Example 2:
<html>
<head>
<title>User-defined objects</title>
function book(title, author)
{
this.title = title;
this.author = author;
}
</script>
</head>
<body>
var myBook = new book("Perl", "Mohtashim");
document.write("Book author is : " + myBook.author + "<br>");
</script>
</body>
</html>
JavaScript Native Objects

Here is the list of all important JavaScript Native
Objects:
JavaScript Number Object
JavaScript Boolean Object
JavaScript String Object
JavaScript Array Object
JavaScript Date Object
JavaScript Math Object
JavaScript RegExp Object

A scriptable browser contains one global Date object per
window.
When you wish to work with a date, such as displaying
todays date, you need to invoke the Date object
constructor function to obtain an instance of a Date object
tied to a specific time and date.
var today = new Date();
document.write(today);
Produces:
Sun Nov 19 19:26:35 EST 2006
JavaScript
16

The Date object takes a snapshot of the PCs
internal clock and returns a Date object for that
instance.
Internally the value of a Date object instance is the time
in milliseconds, from zero oclock on January 1st, 1970
Greenwich Mean Time Zone.
You can specify the date information as

parameters to the Date object constructor
var someDate = new Date("September 22, 1952 02:00:00");
JavaScript
17

You can extract components of the Date object via a series
of methods that you apply to a Date object instance.
var today = new Date();
document.write("Milliseconds since 1/1/70 00:00:00 GMT: " + today.getTime());
document.write("<br /> Current year: " + today.getYear());
document.write("<br /> Current month: " + today.getMonth());
document.write("<br /> Current date: " + today.getDate());
document.write("<br /> Current day: " + today.getDay());
document.write("<br /> Current hours: " + today.getHours());
document.write("<br /> Settin time in ms: " + today.setTime(1000000000));
document.write("<br /> Current year: " + today.getFullYear());
JavaScript
18

Results
Milliseconds since 1/1/70 00:00:00 GMT: 1163984366847
Current year: 2006
Current month: 10 (note getMonth is zero based i.e. Jan = 0, Feb = 1)
Current date: 19
Current day: 0
(note getDay is zero based i.e. Sun = 0, Mon = 1)
Current hours: 19
Settin time in ms: 1000000000
Current year: 1970
JavaScript
19
EVENTS
JavaScript's interaction with HTML is handled
through events that occur when the user or
browser manipulates a page.
When the page loads, that is an event. When the
user clicks a button, that click, too, is an event.
Another example of events are like pressing any
key, closing window, resizing window etc.
onmouseover and onmouseout:

These two event types will help you to
create nice effects with images or even with
text as well.
The onmouseover event occurs when you
bring your mouse over any element and
theonmouseout occurs when you take your
mouse out from that element.
Example:
<html>
<head>
<!-function over() {
alert("Mouse Over");
}
function out() {
alert("Mouse Out");
}
//-->
</script>
</head>
<body>
<div onmouseover="over()" onmouseout="out()">
<h2> This is inside the division </h2>
</div>
</body>
</html>
HTML 4 Standard Events

The standard HTML 4 events are listed here
for your reference.
Here script indicates a Javascript function
to be executed agains that event.
Event
Value Description
Onchange
script
Onsubmit
script
Onreset
script
Onselect
script
Onfocus
script
Onkeydown
Onkeypress
script
script
Onkeyup
script
Script runs when the

element changes
form is submitted
form is reset
Script runs when the element
is selected
Script runs when the element gets
focus
Script runs when key is pressed
Script runs when key is pressed
and released
Script runs when key is released
onclick
script
Script runs when a mouse click
Ondblclick
script
Script runs when a mouse double-click
Onmousedown script
Script runs when mouse button is pressed
Onmousemove script
Script runs when mouse pointer moves
Onmouseout
Script runs when mouse pointer moves out of an

element
Onmouseover script
Script runs when mouse pointer moves over an

element
Onmouseup
Script runs when mouse button is released
script
script

JS Events Methods Objects

Încărcat de

Informații document

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

JS Events Methods Objects

Încărcat de

Drepturi de autor:

Formate disponibile

JAVASCRIPT OBJECTS

Objects are composed of attributes.

The syntax for adding a property to an

Methods are useful for everything from

In the following example, the constructor

var employee = new Object();

The Object() Constructor:

JavaScript Native Objects

JavaScript Date Object

JavaScript Date Object

You can specify the date information as

JavaScript Date Object

JavaScript Date Object

onmouseover and onmouseout:

HTML 4 Standard Events

Script runs when the

Script runs when a mouse click

Script runs when a mouse double-click

Script runs when mouse button is pressed

Script runs when mouse pointer moves

Script runs when mouse pointer moves out of an

Script runs when mouse pointer moves over an

Script runs when mouse button is released

S-ar putea să vă placă și