[Back to previous page] [Next Page in Series]

Ken Ward's Java Script Tutorial ...

Writing with Java Script

When this tutorial was first written, there was little other than "document.write" to make changes on the fly in webpages. After a page has been opened, then document.write cannot be used to change the page. The best way to change a page dynamically is to use DOM. You may find this information in the second tutorial. You might want to start with getElementById.

When we used the first  prompt example, we ended up with a page with the name we entered in the prompt written in the page. Something funny was going on there. Here's the code:

<script type="text/javascript">
<!--function Info()
{
Name1=prompt("What is your name Enter a name in the box "+
"so you can see the effect on the page","Fido");
}
document.write("<h1>"+Name1+"\'s Special Page</h1>");
document.write("Welcome to my page ");
document.write(Name1+". ");
document.write("I have made everything just right for you.");
document.write("<p>So, "+Name1+", click <a href='index.html'>here</a> "+
"to learn how to get what you have been dreaming of for so long!<hr>");
//-->
</script>

Launching the prompt message box

The page has a function called Info(). First this launches a prompt message to get the user's name, or whatever they might type. The default name is Fido. If nothing is entered in the prompt box, the name Fido will be used. Whatever is in the input part of the prompt box is stored in the variable Name1.

Note: The text block, by the way, is broken using the quotation marks and the + sign (who said concatenation operator? Order them out at once!) This just stops possible problems with unterminated string errors in advance.

Then the Java Script begins to write stuff. The first line is:

document.write("<h1>"+Name1+"\'s Special Page</h1>")

Getting Java Script to write HTML for you.

The document dot write bit, followed by the first bracket and the quotation mark, writes whatever follows. Here it writes the HTML header (in quotes) plus the variable, Name1, which contains the user's name. The variable is not in quotes because we do not want the computer to print 'Name1', which it would if we put it in quotes. We want it to print the value it contains, here the user's name.

Next, in quotes, we have the back slash followed by an apostrophe. We use the backslash (\) to tell the code we are still entering text, and not ending the string. After more text, we end this string by writing the quotation mark and the end bracket. From here the computer sallies forth and writes whatever we have told it, HTML code and all!

Backslash in strings

The backslash is called an escape character, and we "escape" the quotes when they might be misunderstood by JavaScript.

Filenames and Backslashes

There are other occasions when misunderstandings might occur. For instance, "c:\myFile.htm" will be misunderstood by JavaScipt. We can write the backslash when we want it to be a backslash like this: "c:\\myFile.htm", and JavaScript will write it correctly as "c:\myFile.htm"

End Tags and Forward Slashes (Division sign in JavaScript: "/")

When writing "</script>", and perhaps any end tag, we might get an error in JavaScript when we try to write it as a string. To avoid this, we escape the forward slash like this: "<\/script>". This is also required for all forward slashes written by JavaScript, when writing XHTML compatible code.

How can I write where I want to? Is that code efficient?

Well, I suppose, you are saying do you really have to write all those document writes? Wouldn't one do? And what if you want Java Script to write somewhere other than at the start of the page? All right then, let's look at writing where you like!

 

And for some programming for your brain: check out New Life Course