Why don't browsers throw an error when any other word is used in place of 'javascript' in the value of onclick?

A Primer on Labeled Statements

Labels in JavaScript perform the function of preceding any block of code and find frequent use in loops or switch cases. Labels are less known, but they employ JavaScript syntax that allows you to bind a name to a statement, invoking that part later. The JavaScript label ends with a colon (':') followed by the statement that's being labeled.

myLabel: console.log("Learning labels, eh? 😎");


Decoding Labels: Silent, Not Errors

Browsers interacting with labels present in event attributes like onclick treat them as authentic elements of JavaScript and not errors. This is where the functionality of onclick deviates from href attributes. We define href attributes using a javascript: prefix to indicate an inline script, whereas this prefix is unsaid, yet implied in onclick.

A Label in Action

For understanding the knick-knacks of label usage, let's have a look at the example below:

<button onclick="errorSkippingLabel: if(confirm('Skip Errors?')) console.log('Error skipped. Proceed. 🚀');">Click Me</button>


Here errorSkippingLabel: is the label. It precedes a confirm dialog that alerts the user only if they confirm. The browser executes the viable JavaScript that follows the label errorSkippingLabel: and doesn't drop any error.

When 'javascript:' Matters

With regard to the <a> tags, the "javascript:" protocol prefix plays a crucial role by signifying that the URL anticipates code execution. This prefix essentially changes the browser's default hyperlink behavior to execute the trailing JavaScript code. On the other hand, an event handler like onclick inherently expects JavaScript code, thus rendering the prefix superfluous.

Browsers: The Unsung Heroes of User Experience

In the execution of code in onclick attributes, browsers don't drop any diagnostic messages even when they encounter labels before the executable code. Such silent processing guarantees a seamless user experience, offering developers the freedom to manage JavaScript labels without unexpected error distractions.