Jaca SC 2

JAVASCRIPT:
1. DOCUMENT OBJECT
MODEL (DOM)
Window
Document
anchor
link
Form
textbox
textarea
radiobutton
checkbox
select
button
2. Definition (DOM):
The Document Object Model is a platformand language-neutral interface that will allow programs
and scripts to dynamically access and update the
content, structure and style of documents. The document
can be further processed and the results of that
processing can be incorporated back into the presented
page.
The W3C DOM specifies a way of treating a

document as a tree of nodes.
Here, every discrete data item is a node, and child

elements or enclosed text become subnodes.
3. JavaScript:
An Object-oriented Script
JavaScript makes available a lot of predefined
objects that gives us access to some aspect of

the browser and document.
http://wp.netscape.com/eng/mozilla/3.0/handbook/javascr
ipt
Object
Description
Document
Represents the current web pages body.
Window
This object provides access to the current browser

window.
History
Records what sites the browser has been to before

opening the current web page
4. KEY LANGUAGE
COMPONENTS
Objects
img, form, checkbox, button, textarea

Attributes
height, width, src, href, bgcolor, name
Methods
onclick, focus, alert, getDate()
Statements
document.myimage.src=somepic.jpg
Functions
function doSomething()
{
...statements...
}
5. JAVASCRIPT ARRAYS
Arrays are predefined JavaScript objects.
An array must be declared before it is used.
-- arrname= new Array (Array length);
-- arrname1= new Array();
JavaScript automatically extends the length of
the array, when new array elements are

initialized.
Dense Arrays:- It is an array that has been
created with each of its elements being
assigned a specific value.
6. FUNCTIONS
A function is a definition of a set of deferred
actions. Functions are invoked by event
handlers or by statements elsewhere in the
script. Whenever possible, good functions are
designed for reuse in other documents. They
can become building blocks you use over and
over again.
A script that is sectioned off as a separate
piece of code and given a name. Using this
name, another script can call this script to
execute at any time and as often as it needs to.
predefined functions, like parseInt()

user-defined functions
recursive functions
JavaScript provides seven globally defined

functions :- parseInt, parseFloat, escape, eval,
isFinite, isNaN, unescape.
Creating Functions
function functionName( [argument1]

[,argumentN]) {
[statements]
}
Where to declare Functions
A function can be any where inside a
<script> block
It is recommended to declare functions in the
<head> block of your HTML document
If you have programmed before, you can see
parallels between JavaScript functions and

other languages subroutines.
But unlike some languages that distinguish
between procedures (which carry out actions)
and functions (which carry out actions and
return values), only one classification of routine
exists for JavaScript.
A function is capable of returning a value to the
statement that invoked it, but this is not a
requirement.
Calling Functions
<html><head>
<title>CE3101 demo</title>
<script type="text/javascript">
<!-function calculateValues() {
num1 = parseFloat(document.forms[0].Number1.value)
num2 = parseFloat(document.forms[0].Number2.value)
result = num1 * num2
alert(result);
}
//-->
</script></head>
<body>
<h1>Multiply the two numbers...</h1>
<form name="form1" method="POST">
<pre>
First Number: <input type="text" size="5" maxlength="5"
name="Number1">
</pre>
<pre>
Second Number: <input type="text" size="5"
maxlength="5" name="Number2">
</pre>
<p>
<input type="button" name="WizButton" value="Multiply"
onclick="calculateValues()">
</p>
</form>
</body></html>
FUNCTION PARAMETERS
Any call to a function, including one that comes from
another JavaScript statement, works the same way: a set

of parentheses follows the function name.
You also can define functions so they receive parameter
values from the calling statement.
Parameters (also known as arguments) provide a
mechanism for handing off a value from one statement to
another by way of a function call.
If no parameters occur in the function definition, both the
function definition and call to the function have only empty
sets of parentheses.
When a function receives parameters, it
assigns the incoming values to the variable

names specified in the function definitions
parentheses. Consider the following script
segment:
function sayHiToFirst(a, b, c)
{
alert(Say hello, + a);
}
sayHiToFirst(Gracie, George, Harry);
sayHiToFirst(Larry, Moe, Curly);
VARIABLE SCOPE
Speaking of variables, its time to distinguish
between variables that are defined outside and

those defined inside of functions.
Variables defined outside of functions are called
global variables; those defined inside functions
are called local variables.
A global variable has a slightly different
connotation in JavaScript than it has in most
other languages.
For a JavaScript script, the globe of a global
variable is the current document loaded in a
browser window or frame.
VARIABLE SCOPE
Therefore, when you initialize a variable as a global
variable, it means that all script statements in the page

(including those inside functions) have direct access to
that variable value.
Statements can retrieve and modify global variables from
anywhere in the page. In programming terminology, this
kind of variable is said to have global scope because
everything on the page can see it.
It is important to remember that the instant a page
unloads itself, all global variables defined in that page are
erased from memory.
In contrast to the global variable, a local variable is
defined inside a function.

The scope of a local variable is only within the
statements of the function.
No other functions or statements outside of functions
have access to a local variable.
Local scope allows for the reuse of variable names within
a document.
For most variables, it is strongly discourage this practice
because it leads to confusion and bugs that are difficult to
track down.
<HTML>
<HEAD>
<SCRIPT LANGUAGE=JavaScript>
var aBoy = Charlie Brown // global
var hisDog = Snoopy // global
function demo() {
// using improper design to demonstrate a point
var hisDog = Gromit // local version of hisDog
var output = hisDog + does not belong to + aBoy +
.<BR>
document.write(output)
}
</SCRIPT>
</HEAD>
<BODY>
demo() // runs as document loads
document.write(hisDog + belongs to + aBoy + .)
</SCRIPT>
</BODY>
</HTML>
Global and Local Variables
A variable is the name given to a location in a

computers memory where data is stored
Declaring variables
To use the keyword var followed by the new
variable name (e.g. var i,j,k)
Local variables
A variable declared inside a function
Global variables
A variable declared outside of any function and
shared by more than one functions
7. WINDOW OBJECT
At the very top of the document object hierarchy is the
window object.
This object gains that exalted spot in the object food
chain because it is the master container for all content
you view in the Web browser.
As long as a browser window is openeven if no
document is loaded in the windowthe window object is
defined in the current model in memory.
In addition to the content part of the window where
documents go, a windows sphere of influence includes
the dimensions of the window and all of the stuff that
surrounds the content area.
The area where scrollbars, toolbars, the status bar, and
(non-Macintosh) menu bar live is known as a windows

chrome.
Not every browser has full scripted control over the
chrome of the main browser window, but you can easily
script the creation of additional windows sized the way
you want and have only the chrome elements you wish to
display in that subwindow.
Attributes of window
window.status property
The status bar at the bottom of the browser window
normally displays the URL of a link when you roll the
mouse pointer atop it.
Other messages also appear in that space during
document loading, Java applet initialization, and the
like.
However, you can use JavaScript to display your own
messages in the status bar at times that may be
beneficial to your users.
window.alert() method
This window method generates a dialog box that

displays whatever text you pass as a parameter.
A single OK button (whose label you cannot change)
enables the user to dismiss the alert.
window.confirm() method
The second style of dialog box presents two buttons

(Cancel and OK in most versions on most platforms)
and is called a confirm dialog box.
More importantly, this is one of those methods that
returns a value: true if the user clicks OK, false if the
user clicks Cancel.
You can use this dialog box and its returned value as
a way to have a user make a decision about how a
script progresses.
window.prompt() method
The final dialog box of the window object, the prompt

dialog box displays a message that you set and
provides a text field for the user to enter a response.
Two buttons, Cancel and OK, enable the user to
dismiss the dialog box with two opposite
expectations: canceling the entire operation or
accepting the input typed into the dialog box.
<HTML><HEAD><TITLE>Window Opener and Closer</TITLE>

var newWindow
function makeNewWindow() {
newWindow = window.open(,,HEIGHT=300,WIDTH=300)
}
function closeNewWindow() {
if (newWindow) {
newWindow.close()
newWindow = null
}
}
</SCRIPT></HEAD>
<BODY><FORM>
<INPUT TYPE=button VALUE=Create New Window
onClick=makeNewWindow()>
<INPUT TYPE=button VALUE=Close New Window
onClick=closeNewWindow()>
</FORM></BODY></HTML>

Jaca SC 2

Transféré par

Informations du document

Titre original

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Jaca SC 2

Transféré par

Droits d'auteur :

Formats disponibles

JAVASCRIPT:

The W3C DOM specifies a way of treating a

Here, every discrete data item is a node, and child

objects that gives us access to some aspect of

Represents the current web pages body.

This object provides access to the current browser

Records what sites the browser has been to before

img, form, checkbox, button, textarea

JavaScript automatically extends the length of

the array, when new array elements are

predefined functions, like parseInt()

JavaScript provides seven globally defined

function functionName( [argument1]

If you have programmed before, you can see

parallels between JavaScript functions and

another JavaScript statement, works the same way: a set

When a function receives parameters, it

assigns the incoming values to the variable

between variables that are defined outside and

variable, it means that all script statements in the page

In contrast to the global variable, a local variable is

defined inside a function.

Global and Local Variables

A variable is the name given to a location in a

The area where scrollbars, toolbars, the status bar, and

(non-Macintosh) menu bar live is known as a windows

This window method generates a dialog box that

The second style of dialog box presents two buttons

The final dialog box of the window object, the prompt

<HTML><HEAD><TITLE>Window Opener and Closer</TITLE>

Vous aimerez peut-être aussi