Basic JavaScript Lesson 1

JAVASCRIPT

INTRODUCTION

JavaScript is a well featured object oriented programming (OOP) language.
It is not Java.
It is mor light weight language used exclusively on web pages to mainpulate objects on the page and embedded in the browser itself.
Like all programming languages, JavaScript's basic purpose is to pick up on the actions of the user and react to them.
JavaScript does this through a series of Event, Functions, and Objects.
There are all sorts of Events like the famous "onMouseOver" event that initiates the common image rollover or pop up menu. Events are added to HTML tags just like attributes and point to a function.Event coded in its tag, a JavaScript function is called and run.
This is referred to as a "function call"
A function contains JavaScript "statements" that mainpulate an Oblect in some way.This is done dynamically in real time.
Once we point to an object with a reference like above, we can use JavaScript Methods and Properties to manipulate that object. amethod is something an object can do ro call on. A property is a characteristic of an object that can be dynamically changed by JavaScript.
Let me explain

we will changing th background color of web page when an event occurs.Let me make the background of a page change colors when a link on the page is hovered over.
Lets start out by making a simple web page with a gray background:
[script language="JavaScript"]
function change_color(){
document.bgColor="red";
document.fgColor="green"}

function change_back(){
document.bgColor="white";
document.fgColor="black"}

[/script]

follow html code

[html]
[head]
[title]JS Background Changing[/title]
[script language="JavaScript"]

function change_color(){
document.bgColor="yellow";
document.fgColor="green"}

function change_colorA(){
document.bgColor="red";
document.fgColor="blue"}

function change_colorB(){
document.bgColor="#410000";
document.fgColor="#222222"}

function change_colorC(){
document.bgColor="green";
document.fgColor="#810000"}

function change_colorD(){
document.bgColor="pink";
document.fgColor="#710000"}

function change_colorE(){
document.bgColor="#720000";
document.fgColor="#FFFFFF"}

function change_colorF(){
document.bgColor="yellow";
document.fgColor="pink"}

function change_colorG(){
document.bgColor="yellow";
document.fgColor="black"}

function change_colorH(){
document.bgColor="red";
document.fgColor="green"}

function change_colorI(){
document.bgColor="green";
document.fgColor="white"}

[/script]
[style]
a {margin-left:10px;margin-right:15px;color:#000000;text-decoration:none;font-size:14px;font-weight:bold;}
[/style]

[/head]

[body bgcolor="gray"]

[p]Here's some regular ol' paragraph content.[/p]

[a href="#" onMouseOver="change_color()"]AAAAA[/a]
[a href="#" onMouseOver="change_colorA()"]BBBBBB[/a]
[a href="#" onMouseOver="change_colorB()"]CCCCC[/a]
[a href="#" onMouseOver="change_colorC()"]DDDDD[/a]
[a href="#" onMouseOver="change_colorD()"]EEEEE[/a]
[a href="#" onMouseOver="change_colorE()"]FFFFF[/a]
[a href="#" onMouseOver="change_colorF()"]GGGGG[/a]
[a href="#" onMouseOver="change_colorG()"]HHHHH[/a]
[a href="#" onMouseOver="change_colorH()"]IIIIII[/a]
[a href="#" onMouseOver="change_colorI()"]JJJJJJ[/a]
[/body]
[/html]
i am using here <> for []