How do HTML DOM properties works?

Question

Is document.InnerText a variable?

If not then why it has assignment operator like this code below:

document.InnerText=count

I tried to reverse the count and document part it doesnt work the other way.

Answer 1

Look at this diagram of the HTML Document Object Model. You'll see document is the top of the tree. It contains a root element, which is the html, which contains every html element in your web page.

Only the html elements can have innerText. Here is a list of the built-in methods and properties of the document object; innerText isn't in there. But JavaScript objects are built on the fly (unlike in most object oriented languages like Java, where they must be defined in advance). Try saying document.potato = 7. The JavaScript interpreter will happily create a potato property within the document and assign the value 7 to it.

What does this do to the web page? Nothing at all, because the potato property means nothing to the engine in the browser that draws the page. But if later on in the program you say console.log(document.potato) it will print 7 in the console for you.

So when you say document.InnerText=count it will create the property. But like potato it doesn't do anything, because the browser engine doesn't recognize that property. That's why it's not doing anything.