The variable this

A JavaScript function is an objectA "bundle" of values.; when a function is called, the this propertyA slot for one of the values bundled in an object. has the value of the object that called the function.

In this part of the example, this is the button object, since the single-line script is the value of the button's onclick attribute.

<button onclick="this.textContent='Request granted'">
  Click to change the button
</button>

In contrast, in this part of the example, this is the paragraph, since the scripts are the values of the paragraph's onmouseover and onmouseout attributes.

<p id="changehere"
  onmouseover="this.style.color='red'"
  onmouseout="this.style.color='black'">
  Mouse over this paragraph to see the colour change.
</p>

Before doing so, guess what will happen when you click on the button or mouse over the paragraph.

Note:

Hints:

  • undefined
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX
1
2
<!DOCTYPE html>
<html lang="en">
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX