1. Week#3 Day#1 Java Script Course

2. Lab Issue ?????

3. FUNCTIONS
A general task such as working for world peace is some thing we can do, but not some thing we can currently write programs to do

4. What is a Function?
A function is a block of predefined programming statements whose execution is deferred until the function is “called.”
In other words, a function is a predefined block of code that doesn’t execute until you “call” it.
Defer = put off to a later time; postpone.

5. You call a function by invoking its name, along with any required or optional parameters.
Function parameters, also known as arguments, are data values or data references that you pass to a function

6. Syntax function functionName() { code to be executed }
With Parameters
function functionName(var1, var2, ...) {     code to be executed }

7. Calling Functions Without arguments: functionName(); With arguments:
functionName(arg1, arg2, ...);

10. Types of Functions
In JavaScript, there are basically two types of functions:
Predefined functions
User-defined functions

11. Predefined functions They are further divided into 2, they are:
functions predefined by the JavaScript language but not associated with any particular object. Examples: parseInt(), isNaN().
functions predefined by the JavaScript language and associated with objects that have also been predefined by the language. Examples: document.write(), and someDate.getDate().

12. User-defined functions
They are also of two types:
functions defined by a programmer, often called user-defined functions. Examples: helloWorld(), greetVisitor(), etc.
functions defined by a programmer and associated with a particular object, usually a user-defined object. Example: student.setGrade().

13. Let Us See Some Examples

14. Methods for Changing Case
toLowerCase() and
toUpperCase()
Example:
var myName = “Warsame"
document.write(myName.toUpperCase(), "<BR>")
document.write(myName, "<BR>")

15. setTimeout() and setInterval()
The window method setTimeout lets you call a function after a specified number of milliseconds have elapsed. In essence, it allows you to set a timer that calls a JavaScript statement or function after a certain period of time.
Syntax: setTimeout("statement", numMilliseconds) OR setTimeout("functionName", numMilliseconds)

16. clearTimeout
The creator of JavaScript anticipated that you might want to turn off a setTimeout after you started it, that is, that you might want to stop it before it executed.
So he created setTimeout to return an integer representing the timeout’s unique identification. By assigning the returned ID to a variable, you can control the time-out, stopping it if necessary.

17. Syntax for saving a time-out’s unique ID: timerName = setTimeout("functionName", numMilliseconds) Syntax for using clearTimeout: clearTimeout("timerName")

18. .js
.html

19. setInterval()
The window method, setInterval differs from its cousin and predecessor setTimeout in that it repeatedly calls a statement or function every so many milliseconds.
Syntax: setInterval("statement", numMilliseconds) or setInterval("functionName", numMilliseconds)

21. Events and Event Handling

22. Events and Event Handling:
Event: is an action performed by a visitor.
Event Handler: is the mechanism that allows us to capture and actually respond to that event with a scripting language.
Real-world analogy:
Event: the phone rings.
Event Handler: pick up the phone and say “Hello”.

23. Writing Event Handler.
Event Handlers are written inline with HTML, just like HTML attribute or in separate JS file.
The only difference is: you enter a script or function call as the attribute value.

24. Some Events belong to specific Objects
Some Popular Events
Event
Event Handler
Load
OnLoad
Click
OnClick
DblClick
OnDblClick
MouseDown
OnMouseDown
MouseOver
OnMouseOver
Submit
OnSubmit
Reset
OnReset
Select
OnSelect
Change
OnChange
Some Events belong to specific Objects

25. Basic Example.. OnClick

26. An Other Example.. Onload

27. DoubleClick Event Example
HTML Code
JS Code

28. Handling On key down event
JS part is missing !!!!

29. Week#3 Day#2 Java Script Course

30. Creating Rollovers
I haven’t failed. I’ve found 10,000 ways that don’t work. —Thomas Edison

32. Disjoint Rollover
Next Page Write the code to change the image when someone hovers over the link not the image.

33. Previous Next

34. Working With Dates And Times

35. The Date() Object
In terms of data types, dates just don’t fit into one of the primitive types.
They’re more than simple strings; they have numeric properties, too.
For instance, today succeeds yesterday and precedes tomorrow, so there’s an order to dates like with numbers.
However, you don’t normally represent a date just as a number either.

36. Because dates are a special kind of data type themselves, JavaScript includes a Date object.
JavaScript represents a date as a number; the number of milliseconds between January 1, 1970, at 00:00:00:00 hours and the date to be referenced.
Dates before January 1, 1970, at 00:00:00:00 are represented as negative numbers, those after as positive numbers.

37. Creating a Date Object
The first, and simplest, way of creating a Date object is to use the new operator and call the Date constructor function without any parameters.
This will create a Date object and initialize it with the client’s current date and time.
var dateName = new Date()
For example:
var today = new Date()

38. While initializing a Date object with the client machine’s current system date and time is very useful for some purposes, there are times when you want to work with specific dates and need to initialize a Date object accordingly.
Fortunately, JavaScript provides four ways of accomplishing this; some examples are shown:

39. One Method
Provide a single string argument describing the date and time.
var dateName = new Date("month day, year hours:minutes:seconds")
var dateName = new Date("weekday, month day, year hours:minutes:seconds")
Examples:
var independenceDay = new Date("July 4, 1776")
var independenceDay = new Date("Thursday, July 4, :05:20")

40. Another Method
Simply specify the date by providing three numeric arguments representing the year, month, and day.
var dateName = new Date(year, month, day)
Example:
var independenceDay = new Date(1776, 6, 4)
This is by far the simplest. Notice that July is represented as a 6. This is not a mistake. JavaScript numbers months beginning at 0.

41. Some Date Methods getDate() getDay() getFullYear()
Returns the date’s day of the month according to local time.
1 to 31, where 1 is the first day of the month.
getDay()
Returns the date’s day of the week according to local time.
0 to 6, where 0 is Sunday, 1 is Monday, is Saturday.
getFullYear()
Returns the date’s full, four-digit year according to local time.
Four-digit year.

42. getMonth() getHours() getMinutes() getSeconds() …
Returns the date’s month according to local time.
0 to 11, where 0 is January, 1 is February, is December.
getHours()
Returns the date’s hour according to local time.
0 to 23, where 0 is midnight (12 a.m.), 1 is 1 a.m., is 11 p.m.
getMinutes()
Returns the date’s minutes according to local time.
0 to 59.
getSeconds() …

43. Let Us See Some Examples
Displaying Dates:
Display Current Time:

44. Countdowns
Countdowns are a nice way to tell the visitor how many days, hours, or even minutes until a particular event occurs. Do you have some date you’re looking forward to? A particular holiday perhaps?
Let’s see how to put a countdown in a Web page so you can keep track of how fast time is flying to that long-awaited day.
Let us see an example:

45. See You Next Week Insha Allah