0

I have been web coding for over 4 years now and for some reason this question popped into my head. I can write HTML, CSS, and JavaScript and I understand the DOM, but I realized if the DOM is merely an interface, what is a JavaScript object for? Is it displayed to the user using a render function you make up, sort of like Java? Is it similar to an MVC where the view is the HTML, the controller is the user input which updates the model and view?

I know this would be discussed in a CS class but I have been through 2 years already and still don't know it.

I did a little bit of looking on this topic but this isn't what I'm looking for. What is the relationship been the DOM, raw html, and what is display on the page?

Community
  • 1
  • 1
  • Er.. That's Document Object and the other is JavaScript Object. JavaScript Object cannot be seen, while Document Object can be seen. Does this make sense? – Praveen Kumar Purushothaman Jul 01 '16 at 12:55
  • What is an object for in any language? To hold state and/or provide behaviour. Javascript objects need not be related to html in any way. – nnnnnn Jul 01 '16 at 12:55

3 Answers3

1

I don't agree that DOM is an interface. It's a tree representation of the markup in the browser. The browser walks the tree and renders its contents.

JavaScript is the language of the browser. It gives you hooks for interacting with the DOM and making its behavior more customized and dynamic.

duffymo
  • 305,152
  • 44
  • 369
  • 561
0

DOM is a term with multiple meanings which include:

  • The structure of elements and other nodes that make up the page
  • The specification which describes how to interact with it programmatically
  • The API that implements that specification

Browsers implement the DOM API and expose it to JavaScript as a set of JavaScript objects (NB JavaScript functions are a type of object).

The DOM element is displayed to the user according to the rules for HTML and CSS which are implemented by browsers. The DOM API (as implemented by JS) allows the DOM elements to be manipulated by JavaScript code.

Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335
0

After messing around with Javascript objects and DOM all day I think I finally understand it. Tell me if this make sense. Javascript objects are used to represent internal states of a collection of properties. Using setters we are able to change the properties of these collections. Objects can represented visual via a render function. The render function takes the properties of the object and creates HTML elements. Finally it appends it to the DOM. We can also update these object via a visually controller or batch mode the object in which the user has no control over it. We also need an update function but we have to delete the HTML and rerencer the HTML with the updated representation of the object.