Java is a Programming language developed by Sun Microsystems in 1995,whereas Javascript is an interpreted language used to accomplish small interactive tasks in web pages.Java is a full fledged language that can develop almost any program under all OS.Javascript takes its origin from Livescript and the parent is Netscape.It even has a name Mocha.Though they share some of the syntax and structures and other similarities, there is no connection to the 'Coffee language'.

Javascript has got objects like windows,form,buttons,check boxes etc and are named. Objects have properties and methods.Window open(), button click() are a couple of examples.Method like click is an action.Events are actions that a user performs like submiting,selecting,loading.So 'onClick' is an event handler.

onAbort - the user aborted loading the page

onblur - the user left the object

onChange - the user changed the object

onClick - the user clicked on an object

onError - the script met an error

onFocus - an object is made active

onLoad - an object finished loading

onMouseOver - the cursor moved over an object

onSelect - the user selected the content of an object

onSubmit - the user submitted a form

onUnload - the user left the window

Javascript is case senstive.'myObject,myobject,MYOBJECT all are different.

The browsers shall be always warned to expect a script by including, <script language="javascript"or "visualbasic", followed by the code, and ending with </script>

document.write("Hai Friends") shall write Hai Friends in the document.

alert("Welcome to jaiiq.com") this method shall inscribe the welcome message.

window.location="css.htm" this statement will direct the browser to change to css page.

The first statement is over. Now how to introduce a condition?

if(navigator.appName=="netscape" or "IE5") {

navigator is an object,the browser,appName is the property like netscape ,IE etc.

document.write("netscape" or "IE5" }the brace is closed if the statement is true.Otherwise,

else {

document.write("using someother browser")

This is how javascript starts functioning.

Now let us see a fully functional example to understand how objects,methods,event handlers, variables and conditions are used to accomplish a task to display a calender with current time inscribed on the particular date.

Full Script Example

setCal()

function getTime() { // initialize time-related variables with current time settings

var now = new Date()

var hour = now.getHours()

var minute = now.getMinutes()

now = null

var ampm = "" // validate hour values and set value of ampm

if (hour >= 12) {

hour -= 12

ampm = "PM"

} else

ampm = "AM"

hour = (hour == 0) ? 12 : hour // add zero digit to a one digit minute

if (minute < 10)

minute = "0" + minute // do not parse this number! // return time string

return hour + ":" + minute + " " + ampm

}

function leapYear(year) {

if (year % 4 == 0) // basic rule

return true // is leap year

/* else */ // else not needed when statement is "return" return false // is not leap year

}

function getDays(month, year) { // create array to hold number of days in each month

var ar = new Array(12)

ar[0] = 31 // January

ar[1] = (leapYear(year)) ? 29 : 28 // February

ar[2] = 31 // March

ar[3] = 30 // April

ar[4] = 31 // May

ar[5] = 30 // June

ar[6] = 31 // July

ar[7] = 31 // August

ar[8] = 30 // September

ar[9] = 31 // October

ar[10] = 30 // November

ar[11] = 31 // December // return number of days in the specified month (parameter)

return ar[month]

}

function getMonthName(month) { // create array to hold name of each month

var ar = new Array(12)

ar[0] = "January"

ar[1] = "February"

ar[2] = "March"

ar[3] = "April"

ar[4] = "May"

ar[5] = "June"

ar[6] = "July"

ar[7] = "August"

ar[8] = "September"

ar[9] = "October"

ar[10] = "November"

ar[11] = "December" // return name of specified month (parameter)

return ar[month]

}

function setCal() { // standard time attributes

var now = new Date()

var year = now.getYear()

var month = now.getMonth()

var monthName = getMonthName(month)

var date = now.getDate()

now = null // create instance of first day of month, and extract the day on which it occurs

var firstDayInstance = new Date(year, month, 1)

var firstDay = firstDayInstance.getDay()

firstDayInstance = null // number of days in current month

var days = getDays(month, year) // call function to draw calendar

drawCal(firstDay + 1, days, date, monthName, + year)

}

function drawCal(firstDay, lastDate, date, monthName, year) { // constant table settings

var headerHeight = 50 // height of the table's header cell

var border = 2 // 3D height of table's border

var cellspacing = 4 // width of table's border

var headerColor = "midnightblue" // color of table's header

var headerSize = "+3" // size of tables header font

var colWidth = 60 // width of columns in table

var dayCellHeight = 25 // height of cells containing days of the week

var dayColor = "darkblue" // color of font representing week days

var cellHeight = 40 // height of cells representing dates in the calendar

var todayColor = "red" // color specifying today's date in the calendar

var timeColor = "purple" // color of font representing current time // create basic table structure

var text = "" // initialize accumulative variable to empty string

text += '<CENTER>'

text += '<TABLE BORDER=' + border + ' CELLSPACING=' + cellspacing + '>' // table settings

text += '<TH COLSPAN=7 HEIGHT=' + headerHeight + '>' // create table header cell

text += '<FONT COLOR="' + headerColor + '" SIZE=' + headerSize + '>' // set font for table header

text += monthName + ' ' + year

text += '</FONT>' // close table header's font settings

text += '</TH>' // close header cell // variables to hold constant settings

var openCol = '<TD WIDTH=' + colWidth + ' HEIGHT=' + dayCellHeight + '>'

openCol += '<FONT COLOR="' + dayColor + '">:'

var closeCol = '</FONT></TD>' // create array of abbreviated day names

var weekDay = new Array(7)

weekDay[0] = "Sun"

weekDay[1] = "Mon"

weekDay[2] = "Tues"

weekDay[3] = "Wed"

weekDay[4] = "Thu"

weekDay[5] = "Fri"

weekDay[6] = "Sat" // create first row of table to set column width and specify week day

text += '<TR ALIGN="center" VALIGN="center">'

for (var dayNum = 0; dayNum < 7; ++dayNum) {

text += openCol + weekDay[dayNum] + closeCol

}

text += '</TR>' // declaration and initialization of two variables to help with tables

var digit = 1

var curCell = 1

for (var row = 1; row <= Math.ceil((lastDate + firstDay - 1) / 7); ++row) { text += ''

for (var col = 1; col <= 7; ++col) { if (digit > lastDate)

break

if (curCell < firstDay) {

text += '<TD></TD>';

curCell++

} else {

if (digit == date) { // current cell represent today's date

text += '<TD HEIGHT=' + cellHeight + '>'

text += '<FONT COLOR="' + todayColor + '">'

text += digit

text += '</FONT><BR>'

text += '<FONT COLOR="' + timeColor + '" SIZE=2>'

text += '<CENTER>' + getTime() + '</CENTER>'

text += '</FONT>'

text += '</TD>'

} else

text += '<TD HEIGHT=' + cellHeight + '>' + digit + '</TD>'

digit++

}

}

text += '</TR>'

} // close all basic table tags

text += '</TABLE>

text += '</CENTER>' // print accumulative HTML string

document.write(text)

}