logo
g Text Version
Beauty & Self
Books & Music
Career
Computers
Education
Family
Food & Wine
Health & Fitness
Hobbies & Crafts
Home & Garden
Money
News & Politics
Relationships
Religion & Spirituality
Sports
Travel & Culture
TV & Movies

dailyclick
Bored? Games!
Nutrition
Postcards
Take a Quiz
Rate My Photo

new
Action Movies
Bible Basics
Houseplants
Romance Movies
Creativity
Family Travel
Southwest USA


dailyclick
All times in EST

Full Schedule
g
g JavaScript / Java Site

BellaOnline's JavaScript / Java Editor

g

A First JavaScript Program

Guest Author - Julie L Baumler

There is a programming tradition that when you learn a new programming language, the first program you write is a program that displays the sentence �Hello World�. This is usually called a �Hello World� program. The intention is to take on a relatively small task, displaying predetermined text, and use it to learn how to use the language tools, like the compiler and interpreter and a little bit of syntax. This doesn't make a lot of sense for JavaScript, since JavaScript is usually used in combination with mark-up languages like HTML and XML that are already capable of displaying predetermined text without JavaScript. JavaScript really doesn't come into use until there is a need for some sort of situation specific action. So a JavaScript �Hello World� program would need to somehow react to the user or the environment, not just display the phrase �Hello World!� This leaves a lot of possibilities; for our �Hello World� program, we are going to give a different response depending on the time of day.

Using your text editor, save the following program into a file on your computer or web server as hello_world.html. (If even the first few lines of this don't make sense to you or you don't already have a text editor and JavaScript-capable browser, check out Getting Ready to Learn JavaScript)

PROGRAM

<html>
<head><title>Hello World in JavaScript</title></head>
<body>
<script type="text/javascript">
<!--
// get the current date and time
var now = new Date()

// Check the time
if ( now.getHours() < 12 )
{
// It's before noon
// print "Good Morning World!" in the window
document.write("Good Morning World!")
}
else
{
// It's after noon
// just print "Hello World!" in the window
document.write("Hello World!")
}
//-->
</script>
<noscript>Hi Non-JavaScript User!</noscript>
</body>
</html>

TRY OUT YOUR PROGRAM

Open hello_world.html in your web browser. If your program works, you will see either "Good Morning World!" or "Hello World!" in your browser window. Don't get too worried if it seems like the time of day is wrong, most likely your computer's clock is wrong, but your program still worked! If you see "Hi Non-JavaScript User!", you need to turn on JavaScript in your browser. If you just see a blank window, you have an error. Go back and double check that you typed everything correctly. You can also find a copy of the program here. (Use your browser's view source feature to see the code.) If you still have problems, post a message in the forum and we'll figure it out together.

Congratulations, you've now written your first JavaScript program! Don't worry if you don't understand everything in the program yet, that will come with time. Now that you have this simple program, how can you use your HTML skills to make this more attractive? What do you need to learn to do in JavaScript to make this more useful to you? Are there other situations you would rather react to?
This site needs an editor - click to learn more!

Add A+First+JavaScript+Program to Twitter Add A+First+JavaScript+Program to Facebook Add A+First+JavaScript+Program to MySpace Add A+First+JavaScript+Program to Del.icio.us Digg A+First+JavaScript+Program Add A+First+JavaScript+Program to Yahoo My Web Add A+First+JavaScript+Program to Google Bookmarks Add A+First+JavaScript+Program to Stumbleupon Add A+First+JavaScript+Program to Reddit




JavaScript Beginners' Resources
JavaScript and Java Site and Newsletter
RSS
Related Articles
Editor's Picks Articles
Top Ten Articles
Previous Features
Site Map


For FREE email updates, subscribe to the JavaScript / Java Newsletter


Past Issues


print
Printer Friendly
bookmark
Bookmark
tell friend
Tell a Friend
forum
Forum
email
Email Editor


Content copyright © 2014 by Julie L Baumler. All rights reserved.
This content was written by Julie L Baumler. If you wish to use this content in any manner, you need written permission. Contact BellaOnline Administration for details.

g


g features
Hearing Dog Tool - Adding Randomness

Hearing Dog Training Tool setTimeout()

GCJ - an Independant Java Implementation

Archives | Site Map

forum
Forum
email
Contact

Past Issues
memberscenter


vote
Poetry
Daily
Weekly
Monthly
Less than Monthly



BellaOnline on Facebook
g


| About BellaOnline | Privacy Policy | Advertising | Become an Editor |
Website copyright © 2014 Minerva WebWorks LLC. All rights reserved.


BellaOnline Editor