Keyword: this

In the value part of an Event Handler Attribute 'this' means the element that has the event handler attribute, and can be used to access its properties, such as style. It could be done with document.getElementById() but 'this' is a good bit cleaner. If it's another element buried deep in the page it is easier to use the keyword this, if you can. To access various properties (such as style attribute/property) you have to specify the object that is being changed-- most elements have style attributes and you have to be clear which element you are accessing. If it's the body then document.body.style.theStyle='some-value' is fine since it's one layer deep in the DOM tree.

Examples:

The code:

<p onclick="this.style.textDecoration='line-through'"
   ondblclick="this.style.textDecoration='none'">
Click to cross out. Double click to remove the line.</p>

<h1 onmouseover="this.style.fontSize='30pt';" onmouseout="this.style.fontSize='20pt';"
     style="font-size:20pt">
  Look at Me!
</h1>

<h1 onmouseover="document.getElementById('h1Clickable').style.fontSize='30pt';"
     onmouseout="document.getElementById('h1Clickable').style.fontSize='20pt';"
     style="font-size:20pt" id="h1Clickable">
Look at Me! (Like Above)
</h1>

Keyword: this

Examples:

The code:

...as it appears on the Page:

Look at Me!

Look at Me! (Like Above)