Specifying events
There are three ways to specify events. We have seen each of these in the previous chapter, but let's run through them again now. One is HTML-based and the other two are JavaScript-based. For this example, we are going to use the click event as an example.
Specifying events with HTML
First, the HTML way:
<p id="unique" onclick="magic()">Click here for magic!</p>
The great thing about specifying events this way is that it's quite easy to read this code and predict what it is going to do. As soon as you click on the paragraph, the function magic() will be triggered. There are some downsides too: you can only specify one event this way, and you cannot change the event dynamically either.
Specifying events with JavaScript
Here is the first way to do it using JavaScript.
document.getElementById("unique").onclick = function() { magic(); };