By the end of this chapter, you should be able to:
- Show messages using
- Include a script in an HTML file
The introduction of IE3 and its unfortunate lack of support for the document.images array led Netscape and Sun to standardize the language with help from the European Computer Manufacturers Association (ECMA), giving us yet another name for what had by now become a strange hybrid of powerful and universally supported core functionality and often incompatible object models: ECMAScript. Standardization was begun in conjunction with ECMA in November 1996 and adopted in June 1997 by ECMA and by ISO in April 1998.
- VS Code – VS Code is a text editor used for development. It highlights your code and makes your development experience much nicer. It’s not stricly necessary, as there are other text editors around, but VS Code is Rithm School’s favorite option.
Option + Command + j on a Mac (or
Control + Shift + J on Windows and Linux). Another way to get to the console is to right click on the web page, select Inspect, and then move to the tab called
Hit enter, and you should see a pop-up window with the message you typed inside of the
alert. (Make sure that when you are writing commands in the Chrome console, you always press enter after you type your code; otherwise, the code won’t run.) Try it again with a different message!
console.log. Try it out:
console.log('This is less obtrusive.');
As you start typing more in the console, you will see it begins to fill up quickly. If you would like to clear the console you can either type in
clear() and press enter or press
command + k. You can watch the following video to learn more about how to get started with the chrome console.
Getting started with the chrome console
If you would like see learn some more keyboard shortcuts with the chrome console, you can learn more about that here
Writing longer scripts
shift + enter to get a line break in the console, since just hitting
If you want to write longer scripts, you have a few options. We’ll outline some of them here:
Option 1: Use an online editor
These tools do have a few quirks, though, and they all have a bit of a learning curve. So eventually it’s probably best to move on to one of the following options.
index.html for example). Save your file!
Every HTML file needs a little bit of boilerplate to get started. For now, you can copy and paste the following code in your
<script></script> tag. Inside of the
Now all you need to do is open this file in Chrome. You can open up finder (or explorer for Windows) and double click on the file to open it in Chrome. Or if you’re using VS Code, the Open in Browser extension gives you the ability to right click on
.html files and open them in your default browser.
alert('Coming to you from first.js!');
As before, the code should execute as soon as you open the HTML page in Chrome.
- Who is Brendan Eich?
- How do you hide and show the Chrome console?
- Create a simple page with a script tag. Inside of the script tag declare a couple of variables and then log their values to the console.
confirm– what do they do?
When you’re ready, move on to Variables and Primitives