First of all let me talk about DOM (Document Object Model)is abstraction of the HTML of web page. We can also say that,In web technology this is programming interface that allow javaScript code to interact with html and css of web page. It represents a whole web page as tree like structure and each element of web page are called nodes.
This is image of DOM structure in Web.
Example
<!DOCTYPE html>
<html>
<head>
<title>DOM</title>
</head>
<body>
<h1>Welcome to my web page!</h1>
<p>This is some example text.</p>
<div>
<img src="example.jpg" alt="Image">
</div>
</body>
</html>
JavaScript code can access and manipulate the DOM tree using the document object, which represents the Document node. For example, to change the text of the h1 element in the example above, you could use the following JavaScript code:
document.getElementByTagName('h1')[0].innerHTML = 'I changed content';
I think you get something :)
Some of disadvantages of DOM.
Performance: manipulating the DOM can be slow and resource-intensive
Security: the DOM can be used to access sensitive information on a web page
Browser compatibility: different browsers can have different implementations of the DOM API
Accessibility: poorly designed web pages that rely on the DOM can be inaccessible for people with disabilities
Maintenance: as web pages grow in complexity, managing and maintaining the DOM can become difficult.
I will continue for Reactjs later...
Top comments (0)