0% found this document useful (0 votes)
19 views

JS Sop1 Writeup-1

The document provides an overview of the window object in browsers, detailing its methods such as alert(), setInterval(), and setTimeout(). It also explains HTML events, how JavaScript can react to these events, and the use of event handlers to manage user interactions. Additionally, it covers the Document Object Model (DOM), its significance in accessing and manipulating HTML elements, and introduces methods like getElementById for finding elements in a document.

Uploaded by

dhruvtamboli27
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
19 views

JS Sop1 Writeup-1

The document provides an overview of the window object in browsers, detailing its methods such as alert(), setInterval(), and setTimeout(). It also explains HTML events, how JavaScript can react to these events, and the use of event handlers to manage user interactions. Additionally, it covers the Document Object Model (DOM), its significance in accessing and manipulating HTML elements, and introduces methods like getElementById for finding elements in a document.

Uploaded by

dhruvtamboli27
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 5

Window Object

The window object represents an open window in a browser.

If a document contain frames (<iframe> tags), the browser creates one window
object for the HTML document, and one additional window object for each
frame.

Window Object Methods


Method Description

alert() Displays an alert box with a message and an OK


button

setInterval() Calls a function or evaluates an expression at


specified intervals (in milliseconds)

setTimeout() Calls a function or evaluates an expression after a


specified number of milliseconds

JavaScript Events
HTML events are "things" that happen to HTML elements.

When JavaScript is used in HTML pages, JavaScript can "react" on these


events.

HTML Events
An HTML event can be something the browser does, or something a user does.
Here are some examples of HTML events:

 An HTML web page has finished loading


 An HTML input field was changed
 An HTML button was clicked

Often, when events happen, you may want to do something.

JavaScript lets you execute code when events are detected.

HTML allows event handler attributes, with JavaScript code, to be added to


HTML elements.

Common HTML Events


Event Description

onclick The user clicks an HTML element

onmouseover The user moves the mouse over an HTML element

onunload It occurs when document/page has been unloaded or closes

onkeydown The user pushes a keyboard key

onload The browser has finished loading the page

JavaScript Event Handlers


Event handlers can be used to handle and verify user input, user actions, and
browser actions:
 Things that should be done every time a page loads
 Things that should be done when the page is closed
 Action that should be performed when a user clicks a button
 Content that should be verified when a user inputs data

Many different methods can be used to let JavaScript work with events:

 HTML event attributes can execute JavaScript code directly


 HTML event attributes can call JavaScript functions
 You can assign your own event handler functions to HTML elements
 You can prevent events from being sent or being handled

DOM:
The DOM is a W3C (World Wide Web Consortium) standard.

The DOM defines a standard for accessing documents:

"The W3C Document Object Model (DOM) is a platform and language-neutral


interface that allows programs and scripts to dynamically access and update the
content, structure, and style of a document."

JavaScript HTML DOM


With the HTML DOM, JavaScript can access and change all the elements of an
HTML document.

The HTML DOM (Document Object


Model)
When a web page is loaded, the browser creates a Document Object Model of
the page.

JavaScript - HTML DOM


Methods
HTML DOM methods are actions you can perform (on HTML Elements).
HTML DOM properties are values (of HTML Elements) that you can set or
change.

The DOM Programming Interface


The HTML DOM can be accessed with JavaScript (and with other programming
languages).

In the DOM, all HTML elements are defined as objects.

The programming interface is the properties and methods of each object.

A property is a value that you can get or set (like changing the content of an
HTML element).

A method is an action you can do (like add or deleting an HTML element).

The getElementById Method


The most common way to access an HTML element is to use the id of the
element.

The HTML DOM Document Object


The document object represents your web page.

If you want to access any element in an HTML page, you always start with
accessing the document object.

Finding HTML Elements


Method Description

document.getElementById(id) Find an element by element id

Adding and Deleting Elements


Method Description

document.write(text) Write into the HTML output stream

You might also like