Which is DOM in a nutshell?

Started by arthyk, Sep 16, 2022, 07:40 AM

Previous topic - Next topic
Print
Go Down Pages1
User actions

arthykTopic starter

Sep 16, 2022, 07:40 AM
Can someone provide a simple explanation of DOM for me and clarify whether modifying window elements requires accessing it or if there are alternative methods?

Essentially, I comprehend that it pertains to the document object model, but I am unsure of the need to directly access window elements and whether there are any alternatives for adjusting their parameters.
  •  

Johan68

#1
Nov 18, 2022, 11:36 AM
The Document Object Model (DOM) signifies each HTML tag as an object, and nested tags are considered the "children" of the parent element. The text inside a tag is also treated as an object which can be accessed using JavaScript in order to modify the page.

For instance, the code "document.body" refers to the object for the <body> tag. Executing this code turns the <body> red for three seconds:

Code Select
document.body.style.background = 'red'; // make the background red
setTimeout(() => document.body.style.background = ", 3000); // go back
This is just one small example of what the DOM can accomplish.

HTML/XML documents are viewed in browsers as a DOM tree, where tags represent nodes and form the structure of the document, and text becomes text nodes. Any content written in HTML, such as comments, is present in the DOM tree. Developer tools in the browser allow us to make changes or check the DOM tree.

When working with the DOM, it is important to keep in mind how changes made via JavaScript may impact the visual appearance and performance of the website. Therefore, it is essential to have a thorough understanding of the DOM and its various capabilities.
  •  

Heorhii20

#2
Nov 21, 2022, 03:33 AM
If you translate from a programming language into a simple one, you can imagine that you are an artist in this business, come up with various cool transitions and links to others from the link and indicate good information between them for those who need it. For example, I recently encountered programming in general and can to say it's like a canvas for an artist.Have a nice day! 8)
  •  

Kristen

#3
Nov 23, 2022, 07:48 AM
A DOM is an object that corresponds with an HTML source document, or simply put, it is an object created by the browser when interpreting the text of an HTML page. Through programmatic access to it, we can modify and manipulate the DOM using tools like JavaScript, which allows changes to styles without needing to refresh the page.

Ultimately, the DOM represents a user interface generated from the source HTML, and browsers use it to determine what should be rendered and displayed in the viewport. As web developers, it is essential to understand how the DOM functions and how changes made to it through scripting can impact website performance and interactivity. It is also important to explore other technologies that expand on the capabilities of the DOM, such as jQuery and React.
  •  

AlisaV

#4
Dec 01, 2022, 05:42 AM
When the browser receives an HTML document, it doesn't display it as is, instead, it parses it to construct a page tree or DOM. This allows for the management of HTML content and enables dynamic interactions on websites. As previously stated, HTML itself is merely text. By manipulating the nodes or elements in the DOM tree, we can modify our HTML output that is visualized on the webpage.

However, the usefulness of the DOM extends much further than simply rendering the website. Using scripts, we can interact with every action performed on the page, such as clicks and form submissions. This opens up a wide range of possibilities for building interactive user interfaces that respond to users' inputs and behaviors. As a web developer, it is essential to master the concepts of the DOM to create engaging and effective web applications.
  •  
Print
Go Up Pages1
User actions