Javascript allows adding interactivity and dynamic behavior to web pages. It is a client-side scripting language that was developed by Netscape to address the limitations of static HTML pages. Javascript events occur when a user interacts with a web page, such as clicking a button. Event handlers in the form of Javascript functions execute in response to these events. Common events include load, click, change, and submit. The Browser Object Model includes objects like window, document, and form that can be manipulated with Javascript to control what happens in the browser.

1. CHAPTER 2
JAVASCRIPT (PART-2)

2. Javascript
• HTML was originally used to control the appearance of
web pages. The web pages designed using HTML, were
static and could not be changed after the browser
rendered them.
• However, with the growth of internet, people demanded
the website to have greater interactivity and better visual
design. But, HTML could only provide static web pages.
Thus, the demand of more interactivity created the need
for a new web programming language.
• Hence, Netscape developed Javascript.
• Javascript is a client side scripting language that allows to
add programming aspects to web pages
• Definition of Scripting language:-
• A Scripting language is a simple, lightweight programming
language that does not contain the advanced programming
functionalities of languages like C and Java.

3. JavaScript event
• The interaction between the user and the
web pages causes the browser to generate an
event. In other words, when the user does
something an event takes place.
• When the user clicks the submit button, which
is known as event, the function is loaded and
the statements inside the function will be
executed.

4. JavaScript event
• Abort Loading of image is cancelled
• Error Error occurs during loading of a document or image
• Focus Element such as button becomes active
• Blur Element such as radio button becomes inactive
• Load Document or image is loaded
• Unload User leaves a page
•
• Click User clicks on a form element
• Mouseout Mouse moves off the element
• Mouseover Mouse moves over the element
• Select Users selects a form field
• Change Value of a form field is changed by the user
• Reset Form fields are reset to default values
• Submit User submits a form
• Note:::: Set or exit is not an event.

5. Event Handler
• When an event occurs, a specific JavaScript
code is executed in response to a given
situation. This JavaScript code is known as
event handler.
• The click event will have an event handler as
onclick() and submit event will have an event
handler as onsubmit().

6. • A function is a reusable block of code that performs a
particular task.
• A function is defined by the keyword function & the block
of code is written inside the curly braces {}.
• JavaScript statements can be grouped together in a block.
A block starts and ends with the curly bracket.
• The function will be executed by an event or when it is
called inside a source code.
• A function is called by its name. it can also take a value
inside the parenthesis. This value is passed as a argument
or parameter to the function.
• Sometimes function return a value using Return
statement. Return statement will stop the function from
executing, and return the specific value.
Function in javascript

7. Variable in Javascript
• A variable is a container for storing data.
• Variable in JavaScript is case sensitive.
• Number, String or characters can be stored in
variable.
• In JavaScript, we can declare a variable using var
keyword.
• Example
– var pi=3.14;
– var x=”Nuzhat”;

8. Conditional if
• The conditional statement if is used to change
the flow of the program.
• The if statement evaluates an expression to
validate specific condition.
• If the condition is true, then the program
enters if block and executes the statements
inside it.

9. BOM (Browser Object Model)
• All browsers are split into different parts or objects
that can be using JavaScript. These parts are known as
the Browser Object Model or BOM.
• To control the web browsers window or the web page
we use the Browser Object Model (BOM)
Window
document
link form anchor
Radio Button checkbox text textarea select

10. Window object
• The top level object in the browser object model is
window object. Window object represents the browser
window or individual frame within the window.
• It is created automatically by the browser.
• The window object is the global object as it contains all
the other objects of the browser object model within it.
• We can use the properties and the methods of objects in
the browser object model to change the window or
elements displayed in the browser.
• The window object contain document object.

11. Document object
• The document object is the most important
object in the BOM.
• The method and properties of document
objects are used to control the web page.
• It is used to represent the web page displayed
in the browser.
• All the elements of the webpage like forms,
images, links and others are contained within
the document object.
• The document object contains a form object,
similarly the form object contains element
object.

12. Element Object
• The element object is used to reference each element in a form.
• The element objects can be radio, text, checkbox or any other
object.
• Example: document.form1.fname.value
document form element
object object object
NOTE:::::
The methods and properties of the window object to control the web browser
window
The method and properties of the document objectto control the web page.

13. • document.write() is used to display something
directly in the browser.
• document.write(“Nuzhat Memon”);
Object method text-variable
(semicolon used as a separation)
• In statement document.write()-write is a
method which is a part of the document object.
• The semicolon at the end of statement is
optional in JavaScript. The semicolon is used as
a mark of separation rather than termination.

14. Alert()
• JavaScript provides some inbuilt function such
as alert().
• The alert() function takes the text and displays
it in an alert box.

15. Focus() method
• Some fields are marked with a red color asterisk mark
“*” , this is an indication to the user that it is a
compulsory field which should not be kept empty
• Focus() method is used to apply focus on a particular
element of the form.
• Focus method is used after getting alert() message.
• Focus method is used to take the control to the
specific element of the form.
• The user get an alert message, the cursor will be placed
inside the element and the particular element will be
highlighted.

16. isNaN() method
• To work with numeric values, JavaScript uses built-in
functions called isNaN()
• NaN stands for “Not a Number”
• isNaN() determines whether the value is NaN(Not a
Number).
• It returns true if the value is not a number and false if
the value is a number.
• For Example:::::
– isNaN(“Nuzhat”)true
isNaN(“Nuzhat”)true as the value “Nuzhat” is not a number.
– isNAN(123)False
isNaN(123) false as the value “123” is a number.

17. Thank You