It’s a long-standing tradition in the coding world that the first thing you write in any new programming language should always display “Hello, World!” I’m not out to upset tradition here, so that’s what we’ll start with, too. Running the script below will display that same classic phrase on your very own Web page.
If you’re familiar with HTML tags, most of this should look pretty familiar. You can skip to later in the article . For those who aren’t in the know about HTML, I’ll start from the top.
This tag tells the browser that what follows is HTML code, which the browser should understand. Browsers tell the difference between the tags on your page and text that should be displayed by surrounding the tag with angle brackets: < and >. Anything inside these characters is a command to the browser.
This starts the head section of the HTML page. Here’s where things (such as the title of the page) are defined once for the entire page. Most of our future scripts will be put into the head area.
<title> My first script </title>
These lines tell the browser the title of the page: “My first script.” The title section is enclosed within beginning and ending
<title>tags. An ending tag looks just like a beginning tag, with one difference: it starts with
And so ends the head part of the HTML page. In the same way that
</title>ended the title section,
</head>ends the head section.
As you might have guessed by now, this tag starts the body section of the HTML page. This area contains everything: all the text and images that are displayed on the page itself. In this particular case, our goal is to write text into the Web page, so our script goes into the body area.
If you are familiar with HTML tags , here’s where you should jump in again.
<!-- Hide script from older browsers
<script>tags. Well, unfortunately, some don’t. Some of them have the bad habit of assuming that everything inside these tags is text that you want to display in the browser window. The result, as you might expect, is ugly. Really ugly.
This line is for those browsers. It starts off by indicating a long-form HTML comment, using
The comment should always be the very first line right after the
OK, let’s try that again, in English this time.
documentis an object.
If we want to write something on this Web page, the command is called write . A command that does something is called a method , and methods are applied to objects. You can always tell a method because it’s followed by a set of parentheses. If it helps, you can think of objects as nouns and methods as verbs, and when you put the two together, you can make something happen.
document.write(), you know that the write() method is associated with the document object.
So, now that we’re writing something, what are we going to write? That’s where those parentheses come in. Whatever is inside the parentheses will be written out to our Web page, and in this case that’s “Hello, World!” Anything can be given to ( passed to )
write()is known as a parameter .
// End hiding script from old browsers -->
</script>tag, everything inside will be seen as just one big HTML comment.
As you’d expect by now, this is the end of the script.
Here’s the end of the body section.
And here’s the end of the entire Web page. This should be the very last bit of text on your HTML page.
By the way, how you indent your code doesn’t matter — in fact, you don’t have to indent it at all. I’ve done it in this lesson simply to make it easy to see where tags begin and end. I recommend that you use a similar style in your own scripts, as it’s very helpful when you’re trying to figure out where you’ve made a mistake.