JavaScript in the Browser

JavaScript is an interpreted language and needs a host environment to run. Because of its origins, the main environment that JavaScript runs in is the browser, although it can be run in other environments; for example, Node.js can be used to run JavaScript on a server. By far the most common use of JavaScript is still to make web pages interactive. This means we should have a look at what makes a web page.

Three Layers of the Web

Nearly all web pages are made up of three key ingredients―HTML, CSS, and JavaScript. HTML is for the content, CSS is the presentation layer, and JavaScript adds the interactivity. You can think of this as being a bit like a pizza. You start with the base, the HTML. Then you layer the sauce and cheese on top, that’s the CSS. And last of all you put the toppings on. Each layer exists separately, but adds something extra to the pizza. In the same way that you can have a perfectly good pizza without any toppings, it isn’t essential to have JavaScript on a website. And just as you can also have a pizza without any cheese that won’t taste any good, a website without CSS will function perfectly well, but it won’t look particularly good.

Keeping the Layers Separate

It is now widely considered best practice to keep all of these layers separate and separate the concerns of each layer, so each layer is only responsible for one thing. Putting them altogether can lead to very complicated pages where all of the code is mixed up together in one file, causing "tag soup" or "code spaghetti". 
This used to be the standard way of producing a website and there are still plenty of examples around on the web that do this.  

Each layer builds on the last. A web page should be able to function with just the HTML layer―in fact, many websites celebrate "naked day" when they remove the CSS layer from their site. A website using just the HTML layer will be in its purest form and look very old school, but should still be fully functional.