Scribd
Upload
14 views

DOM (Document Object Model)

Uploaded by

atifrashid02
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
14 views

DOM (Document Object Model)

Uploaded by

atifrashid02
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 8

DOM (Document Object Model)

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

The 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.“

The DOM standard is separated into 3 different parts:

• Core DOM - standard model for all document types


• XML DOM - standard model for XML documents
• HTML DOM - standard model for HTML documents
HTML DOM

The HTML DOM is a standard object model and programming interface for HTML. It defines:

• The HTML elements as objects


• The properties of all HTML elements
• The methods to access all HTML elements
• The events for all HTML elements

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).
Document Objects

• 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.
addEventListener()

• The addEventListener() method is used to attach an event handler to a


particular element. It does not override the existing event handlers. Events
are said to be an essential part of the JavaScript. A web page responds
according to the event that occurred. Events can be user-generated or
generated by API's. An event listener is a JavaScript's procedure that waits
for the occurrence of an event.
• The addEventListener() method is an inbuilt function of JavaScript. We
can add multiple event handlers to a particular element without
overwriting the existing event handlers.
SYNTAX & EXAMPLE

element.addEventListener
(event, function, useCaptu
re);

it has three parameters, the


parameters event and function are widely
used. The third parameter is optional to
define.
THANK YOU

You might also like