![]() ![]() ![]() ![]() |
![]() |
Chapter Three Advanced Screen Writing: Targeting |
Putting Your Display Where You Want It As we saw with the first script, the document.write(); call sent your text to display on the present screen page. However, there will be occasions when you want to target a different document - perhaps a different pane if you are using frames, a new window you've opened or simply to exit frames with a new page. target.write(); These calls must always appear within the <SCRIPT></SCRIPT> tags in your HTML. They may appear within a called routine invoked with an onMouseover=, onClick= or onSubmit= or a subsequent script call of that routine. They may also appear as the only contents within the <SCRIPT> and </SCRIPT> tags. target may be any of the usual HTML targets: 1. the present document: 2. a window 3. a frameset target You may write text, variables or even have arguments in the parentheses. As you learned already, long lines can be lost in JavaScript, so that we need to limit line lengths to about 50 to 80 characters. You can concatenate the data being written with plus signs (+). There is a neatso JavaScript in the Tool Box in Chapter Twenty-Three that will allow you to paste HTML into a window and get back the data written in the concatenated format without having to hand type all of it. target.writeln(); You probably won't use this call a lot, but if you come across it somewhere, you should know what it is. This call is identical to the document.write(); call above, except that it adds a newline character after the write when it is sent to the screen. This makes no difference in usual HTML, of course, since it is not a substitute for the It is easier to define a variable equal to the newline and integrate it into your text instead of having to write "document.writeln()" over and over. There's yet another reason for defining your own newline variable, and we'll get to that later. OK. Now, if you want to write a JavaScript to see how all of this works, now's the time to do it. First, a script that does not "preload": Click Here to see this script. Now, the very same notion, but where the script is "preloaded": Click Here to see this script. Note: Stuff you write to screen using JavaScript (except into text area form elements) will not print when the user tries to print from screen. This is apparently so for security reasons. Formatting HTML to Screen You can include HTML tags in the strings you write to screen as we have already seen. All you have to do is include them. Click Here to see this script. Similarly, you can include any of the tags you use for conventional HTML documents. I find this the easiest way to go, personally. But Netscape® has created a library of shortcut calls that allow you to format that text as you write it to screen from JavaScript. I find myself forgetting to use these shortcuts lots of the times. If you are very comfortable with HTML, it is probably just as easy for you to simply include the HTML tags in the text you are sending to screen. The best part of being lazy (like I am) is that you can skip the rest of this chapter of library calls for formatting text! But, if you were early-potty-trained, feel free to go ahead and learn them all. You will be a better programmer than I am almost immediately! Caution: using these calls will make your JavaScript less Ugly. You will run the risk of seeming to know what you are doing. Library of "Pretty" JavaScript calls: variable.anchor(name); When writing your stuff to screen, the .anchor() call will cause variable to be displayed as if it were in the HTML <A NAME="name"></A> tags. These four are equivalent. Which you use is a matter of preference: variable.big(); When writing to screen, the .big() call will cause variable to be displayed as if it were enclosed within the HTML <BIG></BIG> tags. These four following JavaScript calls are equivalent. Which you use is a matter of preference: variable.small(); When writing to screen, the .small() call will cause variable to be displayed as if it were in the HTML <SMALL></SMALL> tags. These four are equivalent. Which you use is a matter of preference: variable.blink(); When writing to screen, the .blink() call will cause variable to be displayed as if it were in the HTML <BLINK></BLINK> tags. These four are equivalent. Which you use is a matter of preference: variable.bold(); When writing to screen, the .bold() call will cause variable to be displayed as if it were in the HTML <B></B> tags. These four are equivalent. Which you use is a matter of preference: variable.fixed(); When writing to screen, the .fixed() call will cause variable to be displayed as if it were in the HTML <TT></TT> tags. These four are equivalent. Which you use is a matter of preference: variable.fontcolor(color ); When writing to the computer screen, the .fontcolor(color) call will cause variable to be displayed as if it were in the <FONT COLOR="color"> </FONT> HTML tags. These four are equivalent. Which you use is a matter of preference: variable.fontsize(x); When writing to screen, the .fontsize(x) call will cause variable to be displayed as if it were in the <FONT SIZE="x"></FONT> tags. x is the numeric literal or variable for the size expressed as a whole number from 1 through 7 or as an additive or subtractive variable, i.e. +1, +2, -1, -2, etc. These four are equivalent. Which you use is a matter of preference: variable.italics(); When writing to screen, the .italics() call will cause variable to be displayed as if it were in the HTML <I></I> tags. These four are equivalent. Which you use is a matter of preference: variable.link(url ); When writing to screen, the .link() call will cause variable to be displayed as if it were in the HTML: <A HREF="url "></A> tags. These five are equivalent. Which you use is a matter of preference: variable.strike(); When writing to screen, the .strike() call will cause variable to be displayed as if it were in the HTML <STRIKE></STRIKE> tags. These four are equivalent. Which you use is a matter of preference: variable.sub(); When writing to screen, the .sub() call will cause variable to be displayed as if it were in the HTML tags. These four are equivalent. Which you use is a matter of preference: variable.sup(); When writing to screen, the .sup() call will cause variable to be displayed as if it were in the HTML tags. These four are equivalent. Which you use is a matter of preference: Document Formatting Calls Again, just a reminder, these are optional calls to be learned. You can simply use a document.write(); call that includes the following HTML: document.bgColor This call allows you to specify the color of the target document background. You may use either the RGB Hex pairs or Literal Word Colors. Although theoretically you can change the background color at any time, bugs in earlier browser versions overwrote all content with the color, so the screen appeared to be blank (albeit in the specified color) So care had to be exercised to insure that the background color was timed to occur before any textual and image data was sent to screen. document.fgColor This call allows you to specify the color of the target document foreground (text) May be called from HTML using TEXT=. You may use either the RGB Hex pairs or Literal Word Colors. document.alinkColor This call lets you specify the color of an active link (after mouse-button click down, but before mouse-button release) You may use HEX "#rrggbb" or literal name calls for this color. You cannot set this property after the HTML parser has been through layout, unless you first close the document, reopen it and then rewrite the HTML to screen. document.linkColor This call allows you to specify the color of the document hyperlinks. You may use either a variable, the RGB Hex pairs or Literal Word Colors. document.vlinkColor This call allows you to specify the color of the already visited document hyperlinks. You may use either a variable, the RGB Hex pairs or Literal Word Colors. |
© Copyright 1997, John H. Keyes john.keyes@intellink.net