Going forward, you're going to hear 
me say a certain acronym a lot: DOM.

Dom de dom dom dom

DOM stands for 
Document Object Model,

and it's the way that browsers 
let us developers

manipulate webpages with JavaScript.

Whenever a browser loads a webpage,
it parses all the HTML and CSS,

and converts the document into a DOM.

That DOM is really a 
big JavaScript object

that contains everything we'd ever 
want to know or change about a page,

like every single tag, and 
attribute and style for each tag.

To access the DOM on a 
webpage from JavaScript,

we use the global variable `document`,
and then we can use properties

and call functions that 
are attached to this object here.

The general strategy for 
DOM manipulation is two steps.

Let me just make a list of them here.

Here we go, and then we 
have the second step.

Let's go through each 
of these steps now.

So the first step is to find the DOM node
using an access method.

If all we're looking for is the 
tag, we can access that really easily

just by saying `document.body`.

And now the second step is to 
manipulate the DOM node that we found

by changing its attributes, 
styles, inner HTML,

appending new nodes to it, ... .

So if we just want to replace 
the contents of the whole tag,

then we can use the 
`innerHTML` property.

So `document.body.innerHTML = 
"Webpage be gone!";`

Ta da, I did it.

The browser is watching for 
changes to the document object,

and as soon as it sees you change the 
innerHTML of document.body,

it reflects it back in 
the actual document.

Remember, the document object 
isn't the actual webpage,

but the browser tries to make it reflect
the current page as much as possible.

Now, there are a lot more
ways to do step one,

because usually you want to find
something besides just the body tag.

Maybe you want to find a tag with a 
certain ID, or all tags of a certain type--

That's what we'll talk about in 
the DOM access methods tutorial.

There's also a lot more cool stuff 
you can do in step two,

like changing the attributes 
or styles of the tags you find.

We'll talk about all that in the 
DOM modification tutorial.

Once you've mastered DOM access and 
manipulation, we'll move on to fun ways

to use it, like when responding to 
user events or making an animation.

Right now, it is a little silly 
that we use JavaScript to do

what we could have just done 
with HTML at the beginning,

but trust me, you'll want to master 
DOM access and DOM modification

so that you can make full 
interactive experiences later.

So, keep it up, and see you soon.