Chapter 4
Tag…You're It!
In This Chapter
| Tag Attributes |
| Because this chapter refers to attributes of an HTML tag several times, you need to know what they are. As stated, a typical HTML tag looks like <TAG>. However, many tags accept further specifications that determine their final effect, such as <TAG attribute1=x attribute2=y>. That's all there is to it-when you use a tag that requires or may include attributes, it will be pointed out within the chapter. |
If you're interested in learning JavaScript programming-and I assume you are; this is the wrong book to be reading just for fun-then you must be at least somewhat familiar with HTML by now. To briefly recall, HTML is a markup language used to "describe" how a Web page should look. Web browsers such as Netscape then interpret these markup tags and render the page to the screen. HTML is expressed through tags, which are written in the form <TAG>. Most tags must surround the text on which they operate, and, therefore, have to be paired in the manner <TAG> text to affect </TAG>. This is basic HTML and should not be coming as new information right now; if so, I strongly recommend that you read a primer on HTML, such as Que's The Complete Idiot's Guide to Creating an HTML Web Page, by Paul McFedries.
The tag to know for JavaScript programming is the <SCRIPT> tag. In short, it looks like this:
<SCRIPT attributes> JavaScript program code</SCRIPT>
The opening <SCRIPT> tag has two attributes that it may include:
<SCRIPT language="JavaScript">
| The URL (Earl) of Web? |
| URL stands for Uniform Resource Locator. It's a fancy way of identifying anything on the Internet (a file, a document, a graphic, a web site) anywhere in the world with a unique address. Think of it as a global CyberZipCode: No two web pages, FTP files, UseNet newsgroups, Gopher menus, or whatever can have the same URL. |
This is the standard opening <SCRIPT> tag. It simply defines the start of JavaScript program code, and the language the code is written in (which, obviously, is JavaScript). Note that the JavaScript official documentation claims that the language attribute is mandatory; that is, you cannot simply begin a section of code with <SCRIPT> alone. However, at the time of this writing, <SCRIPT> alone does, in fact, work normally-but one cannot guarantee that will be the case when you read this. You mark the end of a JavaScript code section with <SCRIPT>.
As an alternative to writing the JavaScript code within the Web page source itself, you can refer to JavaScript code that is saved in its own text file elsewhere. This will behave just as if the code were typed directly into the Web page source (as it is in all of these examples). The following is the general format:
<SCRIPT src="URL to your script file"></SCRIPT>
This would be an efficient way of reusing the same JavaScript code in several Web pages, without having to explicitly enter it into each one. You'd merely insert the call to the file. The text file of the JavaScript program must have a file name ending in .js, as in the following example:
<SCRIPT src="http://myscript.js"></SCRIPT>
You place JavaScript code between <SCRIPT> tags wherever you want the code executed within a page. A tiny example of the HTML code of a Web page, with embedded JavaScript code, might look like this:
<HTML><HEAD>
<TITLE>My Nifty Web Page</TITLE>
</HEAD><BODY>
<H1>Welcome to my Exciting Home Page, Where I talk about ME</H1>
<SCRIPT language="JavaScript">
JavaScript program code goes here
</SCRIPT>
</BODY></HTML>
Note that you needn't put all of the JavaScript code within one set of <SCRIPT> tags. You can use numerous <SCRIPT> </SCRIPT> pairs wherever in the page you want to include JavaScript code. Having said that, there are three caveats to note:
- Place all JavaScript function definitions between the <HEAD> </HEAD> tags at the top of the HTML page. That is:
<HEAD><SCRIPT language="JavaScript">
function func1 (x, y, z)
{ statements }
function func2 (x, y, z)
{ statements }
etc.
</SCRIPT>
any other HTML commands that should go in the HEAD section
</HEAD>
Functions must be defined before they can be called-you may not understand what that means just yet, but after Chapter 9, the skies will clear. To briefly summarize, a function is a section of code that performs a specific task. It is like a self-contained miniprogram. For many reasons, in other areas of JavaScript code, you will find the need to call thesefunctions-that is, refer to them by name and have them executed. You'll learn about functions in gruesome detail throughout Chapter 9. In the meantime, simply remember that the above will ensure that all functions have been defined before they are called in any JavaScript code further down in the page.
- Any and all JavaScript code applies only to the page it resides on, including function definitions. Therefore, if you have a set of function definitions that you intend to use on several pages, a time-saver would be the following: compose the function definitions and save them as an individual text file, with a name ending in .js, such as myfuncs.js. Then, in the <HEAD> section of each page, include those function definitions with the <SCRIPT src="http://myfuncs.js"></SCRIPT> tags, rather than writing them out by hand all over again.
- Lastly, you should consider enclosing all JavaScript code within HTML comment tags. An HTML comment tag looks like:
<!- comments ->
Anything within HTML comment tags is ignored by most browsers-except Netscape 2.0, which will recognize the presence of the JavaScript code and not ignore it. The rationale behind this is that other browsers that know nothing of JavaScript might display the code in the Web page itself, which would not be desirable at all. Therefore, in the end, the recommended manner of including JavaScript code into a page is as follows:
<SCRIPT language="JavaScript">
<!-
JavaScript program code goes here
->
</SCRIPT>
It doesn't matter where your JavaScript statements go in your page; they are always evaluated (a fancy term for "made ready to run") after the page has finished loading into the browser.
You need to keep some fundamental rules in mind when you're building your JavaScript pages:
- JavaScript scripts (enclosed within a <SCRIPT> tag) are not evaluated until after the page loads.
- Scripts stored as separate files (read in with the SRC attribute) are evaluated before any in-page script commands.
If someone comes across your Web page with an old browser that doesn't understand JavaScript and the <SCRIPT> tag, what happens? Nothing drastic, but the results aren't necessarily pretty. What the user will see (in addition to the other things on your page) is your script statements, as though they were a paragraph you typed in for display.
This is a problem. A creative HTML writer can design pages that will work without JavaScript (having, for example, less user-interactivity) but, unless the script statements are in an external file, they will be displayed along with everything else_unless you use this little trick: Hide the script statements inside an HTML comment tag.
Hide them inside a comment? And they still work? YES! Comment tags identify parts of an HTML document that you want the non-JavaScript browser to ignore and not try to format or display. Using comments inside the <SCRIPT> tag gives you the added benefit of not having your JavaScript statements displayed by browsers that can't handle JavaScript. So, if the following page was loaded by a JavaScript-less browser:
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!- Hide the script statements from browsers that can't handle them
function dosomething()
{
alert("JavaScript...in hiding.")
}
->
</SCRIPT>
</HEAD>
<BODY>
<BR>
If you can't handle JavaScript...you won't see anything above this line.
</BODY>
</HTML>
In this example, if met by a non-JavaScript browser, only the text "If you can't handle JavaScript…" will appear on the screen. The JavaScript code between the <SCRIPT> tags will be completely ignored because it resides between comment tags <!- ->. The magic is that a browser that can understand JavaScript will not ignore the code between the comment tags, because it is aware of this little trick.
Just a reminder: Although using the comment tag is a good idea when scripting (there still are many browsers out there that don't support JavaScript); all that happens is that the script statements won't be displayed when the page is formatted. The user can still view your script by using the View Source option on the View menu.
This brings up a good question: Is it possible to "protect" a JavaScript from prying eyes? Read on and see.
With all the concern about security in cyberspace these days, you're probably wondering about the "secrecy" of JavaScript. After all, if your prized script is written in the middle of an HTML file, all someone has to do is select the View Source option on the View menu and your hard work is displayed plain as day… right?
Unfortunately, that is right. If you want to keep your script from being seen, place it in an external file and include it using the SRC= attribute of the <SCRIPT> tag. Just make sure that the file ends in ".js".
This chapter introduced you to the new <SCRIPT> tag that extends HTML to allow you to plug JavaScript commands into your Web pages. You also learned the following rules about scripts:
- Scripts are evaluated after a page has finished loading.
- Any functions defined in scripts are not automatically executed when the page loads. They are stored until called by something else in the page.
- Scripts loaded through the SRC attribute (in other words, scripts that are kept in separate files) are evaluated before any inline (or "in-page") scripts.
- Scripts can be placed inside comment tags, to keep browsers that can't handle JavaScript from displaying them on the page.
Now, it's time to take a spin out on the Web. In the next chapter, we take a break from learning the ins and outs of JavaScript, and check out what other Java-ers are brewing up.
For comments or technical support for our books and software, select Talk to Us.
To order books, call us at 800-716-0044 or 317-228-4366.
© 1996, QUE Corporation, an imprint of Macmillan Publishing USA, a Simon & Schuster Company.
