HTML Goodies: Script Tip: Week 18

By Joe Burns

Tips-R-Us...

It's Tip time again and we can pretty much wrap this great script up today. We've talked about how a number is generated and how that number is given an upper limit. Now, we're going to talk about how the results of the random number functions get written to the page.

As a refresher, here's the script and its results once again:



And here's what it all looks like:


<script language="JavaScript">
<!--
function RandomNumber(upper_limit)
{
return Math.round(upper_limit * Math.random());
}
//-->
</script>

<script language="JavaScript">
<!--
var upper_limit = 50;
document.write('Here is a random number between 0 and '
+ upper_limit + ':<P><center>');
document.write(RandomNumber(upper_limit) + '</center>');
//-->
</script>


The JavaScript command that writes the text to the page is document.write(): "document" is the object (it represents the HTML document you're looking at right now); "write()" is a method that acts upon the "document" object (it writes to the page).

Let's look at the first document.write statement:


document.write('Here is a random number between 0 and '
+ upper_limit + ':<P><center>');


The wonderful thing about document.write commands is that they do just that: They write to the page, be it straight text or HTML code, as you can see above. At the very end of the line there is a <P> and <center> flag that will affect the text that follows.

Notice, though, that there appears to be two types of text. The first is straight text. It is simply posted to the page. The sections within the quotes are just straight text to be written to the page. Then there is the text that is surrounded by plus signs.

Those plus signs alert the browser that what is in between is not to be written to the page, but is rather something that represents the output of something else. In the line of code above, +upper_limit+ represents the upper limit number. In this case, 50. Look at the second line of the second script. There it is: "upper_limit = 50". The plus signs just act as triggers to tell the browser to look back. The text between the plus signs is only a representation of something else the script will provide.

Now the second document.write line:


document.write(RandomNumber(upper_limit) + '</center>');


The idea of this document.write command is the same as above, except what is being returned is different. Remember, the text between the plus signs acts as a representation of something else. It was the variable "upper_limit" above.

Now, it's a little different: The item listed in the document.write statement is the name of a function: RandomNumber(upper_limit). You can pretty much guess at what this does. It represents the entire function and thus represents the output of the function. In this case, a number between 1 and 50. The plus sign then acts to end the command.

Finally, you can see the end center command finishing the line of text.

This is a very clever script, created in a compact and easily functioning manner, kind of like a Volkswagon Beetle... Use it in good health!

Next Week: A New Script! Using JavaScript to Create HTML Flags

     Do YOU have a Script Tip you'd like to share? How about suggesting a Script Tip to write about? I'd love to hear it. Write me at: jburns@htmlgoodies.com.


Learn to write your own JavaScripts with the
HTML Goodies 30-Step Primer Series
and take the knowledge home with you in
JavaScript Goodies!


You can find many other uses for JavaScript
on your Web pages here!




Make a Comment

Loading Comments...

  • Web Development Newsletter Signup

    Invalid email
    You have successfuly registered to our newsletter.
  •  
  •  
  •  
Thanks for your registration, follow us on our social networks to keep up-to-date