Home

Scripts Fundamentals

 

The Script and the Document

 

The SCRIPT Tag

One of the most usual ways you will use VBScript is to display text, as if you were using HTML. Indeed, added just a few instructions, you can use any of the HTML tags and make them part of your script. Therefore, everything you have learned in HTML is valid here.

To set the instructions of a script from the HTML tags, the section that has the script must start with the <SCRIPT> tag and end with the </SCRIPT> tag, as follows:

<SCRIPT>
      
</SCRIPT>

You can write the tag in all uppercase, all lowercase, or a mix

Because a script is written in a particular language that is not HTML, and because there are various scripting languages in the industry, to use a script, you should let the browser know what (particular) scripting language you are using. To let the browser know, inside of the <SCRIPT> tag, type the word Language, followed by the = sign, followed by the name of the script language included in double-quotes. For example, to use a VBScript in a page, start the section with <Script language="VBScript"> and end it with the closing tag. Therefore the scripting section can be delimited with:

<Script Language="VBScript>
      
 </Script>

Like HTML, VBScript is not case sensitive. This means that script, SCRIPT, script, and Script are the same. Therefore, you can also include a script in the following:

<SCRIPT LANGUAGE="VBScript">
      
</SCRIPT>

The section between the opening <Script> tag and the closing </Script> tag is called the body of the script. Everything that is part of the body of a script belongs to the script.

 

The Document Object

VBScript uses an object called Document. This object manages many of the instructions that VBScript can handle for HTML. One of the functions of that object is to display a string on the screen. A string is text that the browser is asked to use "as is". The function used is called Write. The syntax of the Write function of the Document object is:

Document.Write(String)

The String to display can be provided in double-quotes or as a variable as we will learn soon. Here is an example of displaying somebody's name using the Document.Write() function:

<SCRIPT LANGUAGE="VBScript">
Document.Write("Jacques Fame Ndongo")
</SCRIPT>

To display various lines of text, you can use as many Document.Write() lines as you need.

A file can have many different script sections and you can include as many lines of code as necessary in a file. To have different script sections, start each with the <SCRIPT> tag and close it with the closing tag. Here is an example:

<SCRIPT LANGUAGE="VBScript">
Document.Write("Book Title: ")
Document.Write("VBScript Programming")
</SCRIPT>
<SCRIPT LANGUAGE="VBScript">
Document.Write("Author: Martin Russel Bitha")
Document.Write("Publisher: Les moules Press")
Document.Write("Year Published: 1998")
</SCRIPT>
 

Practical Learning: Introduction to VBScript

  1. Start your text editor such as Notepad
  2. In the empty file, type the following:
     
    <Script Language="VBScript">
    Document.Write("Leaving Sydney")
    Document.Write("When we decided to leave, we knew we were ")
    Document.Write("making a hard decision. We had spent so much ")
    Document.Write("time this had become our new home. A few weeks ")
    Document.Write("or months before, we wanted to make Sydney ")
    Document.Write("our newly found settlement, a permanent place ")
    Document.Write("we could proudly call ours. It appeared that, ")
    Document.Write("unpredictably, fate had decided otherwise.")
    </Script>
  3. Save the file as sydney.htm in your VBScript Lessons folder
  4. Preview the web page:
     
  5. Notice that the whole text displays as one paragraph.
    After previewing the page, return to Notepad.
 

VBScript and HTML Tags

Everything you learned in HTML is readily available in VBScript. VBScript allows you to mix its own syntax with HTML tags. In order to use this more efficiently, you should understand the mechanics of VBScript.

When you include a string in your VBScript and send it to Internet Explorer, everything that is part of the string is sent to the browser "as is". Once the browser receives your string from the Document.Write() function, it gets rid of the Document.Write words, the parentheses and double-quotes. Then it treats the rest, the part of the string, as HTML code. If the string that was sent is just a group of characters, the browser would display its text. If you send any special character, the browser would analyze it to find out if the character is a special HTML symbol. If it is, it would be treated appropriately. For this reason, a script can result in complex code or difficult to interpret errors.

Based on this, you can include any HTML tag as part of the string. Here is an example:
<Script Language="VBScript">
Document.Write("Book Title: VBScript Programming<br>")
</Script>

When the browser receives this script, it gets rid of everything that is not part of the string. After this operation, the remaining text becomes:
Book Title: VBScript Programming<br>

This is what the browser would try to display. As it happens, there is an HTML tag in the code, namely the break tag <br>; therefore, the break tag would be applied.

You can include any HTML tag as part of your script. Make sure you use the HTML tags appropriately; VBScript will not correct or interpret your tags, it would send them to the browser as they are written.

Practical Learning: Including HTML Tags in a Script

  1. Change the file as follows:
     
    <Script Language="VBScript">
    Document.Write("Leaving Sydney<br>")
    Document.Write("When we decided to leave, we knew we were ")
    Document.Write("making a hard decision. We had spent so much ")
    Document.Write("time this had become our new home. A few weeks ")
    Document.Write("or months before, we wanted to make Sydney ")
    Document.Write("our newly found settlement, a permanent place ")
    Document.Write("we could proudly call ours. It appeared that, ")
    Document.Write("unpredictably, fate had decided otherwise.")
    </Script>
  2. Save the file and preview the page in your browser
  3. After previewing the page, return to Notepad
  4. To make the page more attractive, change it as follows:
     
    <Script Language="VBScript">
    Document.Write("<h1><font face=Verdana color=red>Leaving Sydney</font></h1>")
    Document.Write("<p>When we decided to leave, we knew we were ")
    Document.Write("making a hard decision. We had spent so much ")
    Document.Write("time this had become our new home. A few weeks ")
    Document.Write("or months before, we wanted to make <b>Sydney</b> ")
    Document.Write("our newly found settlement, a permanent place ")
    Document.Write("we could proudly call ours. It appeared that, ")
    Document.Write("<i>unpredictably</i>, fate had decided otherwise.</p>")
    </Script>
  5. Save the file. Return to browser and refresh it
  6. To use more tags, for example to create a table in your script, change the file as follows:
     
    <Script Language="VBScript">
    Document.Write("<table border=0 width=550>")
    Document.Write(" <tr>")
    Document.Write(" <td width=100% align=center>")
    Document.Write("<font face=&quot;Garamond, Times New Roman, Georgia&quot; size=6 color=&quot;#FF0000&quot;>")
    Document.Write("<b>Leaving Sydney</b>")
    Document.Write("</font>")
    Document.Write(" </td>")
    Document.Write(" </tr>")
    Document.Write("</table>")
    Document.Write("<table border=0 width=550>")
    Document.Write(" <tr>")
    Document.Write(" <td width=100%>")
    Document.Write("<p>When we decided to leave, we knew we were ")
    Document.Write("making a hard decision. We had spent so much ")
    Document.Write("time this had become our new home. A few weeks ")
    Document.Write("or months before, we wanted to make <b>Sydney</b> ")
    Document.Write("our newly found settlement, a permanent place ")
    Document.Write("we could proudly call ours. It appeared that, ")
    Document.Write("<i>unpredictably</i>, fate had decided otherwise.</p>")
    Document.Write("<hr color=#FF9933>")
    Document.Write(" </td>")
    Document.Write(" </tr>")
    Document.Write(" <tr>")
    Document.Write(" <td width=100% align=right>")
    Document.Write("Author: Arthur D. Pale<br>")
    Document.Write("Title: Stories Of My Life")
    Document.Write(" </td>")
    Document.Write(" </tr>")
    Document.Write("</table>")
    </Script>
  7. Save the file and check it in the browser
     
  8. After previewing the page, return to Notepad and close it.

Techniques of Managing Code

 

HTML Comments

In some cases, when an older browser interprets your code, it may not be able to validate it. To hide your code from an older browser, include it between <!-- and -->.

A comment is a line of code that is not examined, read, or interpreted by the browser. This means that the browser doesn't display anything that is part of a comment. Therefore, a comment can be written in plain English or the language you are using, with words aligned however you want them. To add a comment to your HTML code, you can include it between <!-- and -->.

 

VBScript Comments

There are two ways you can write a line of comment in VBScript. To create a comment, start the section with the keyword Rem. Everything on the right side of Rem is part of the comment. Here is an example:
 

<SCRIPT LANGUAGE="VBScript">
Rem This line is ignored. I can write it however I want.
Document.Write("2006 FIFA World Cup")
</SCRIPT>

Using the Rem keyword, you can add as many lines of comments as you want. A comment doesn't have to stand on its own line. It can be part of a line of code as long as it starts with Rem and the Rem keyword is not part of code. To add a comment to a line that contains code already, type Rem and include your comment. Once again, anything on the right side of Rem would be ignored by the browser. Here is an example:

<SCRIPT LANGUAGE="VBScript">
Rem This line is ignored. I can write it however I want. Document.Write("2002 FIFA World Cup") Rem The 2002 World Cup was in Rep Korea and Japan
</SCRIPT>

Besides using the Rem keyword, another technique for commenting is by using the single quote character. The single quote plays the exact same role as the Rem keyword. Because of its briefness, the single quote is preferred and is more popular than the Rem keyword.

To create a comment, type the single quote character followed by the desired text of comment. Here is an example:

<SCRIPT LANGUAGE="VBScript">
' Anything on this side is part of a comment
Document.Write("They scored two soft goals")
</SCRIPT>

You can use the single quote the same way you would use the Rem keyword. To add a comment on a line that already has code, type ' followed by the desired text. You can also use a mix of Rem and single quote comments in the same script. Here is an example:

<SCRIPT LANGUAGE="VBScript">
' Movie Quote
Document.Write("<p>We went through a lot of trouble because of you.<br>")
Document.Write("You owe us.</p>") Rem Max starts having a stroke here
Rem Display the movie title
Document.Write("<b>Title:</b> Disorganized Crime")
</SCRIPT>
 

Practical Learning: Using Comments to VBScript Code

  1. To add Rem comments to your code, change the file as follows:
     
    <Script Language="VBScript">
    Rem This exercise illustrates the use of HTML tags inserted into VBScript code
    Rem This is how to add a simple table made of one row and one column 
    Document.Write("<table border=0 width=550>")
    Document.Write(" <tr>")
    Document.Write(" <td width=100% align=center>")
    Document.Write("<font face=&quot;Garamond, Times New Roman, Georgia&quot; size=6 color=&quot;#FF0000&quot;>")
    Document.Write("<b>Leaving Sydney</b>")
    Document.Write("</font>")
    Document.Write(" </td>")
    Document.Write(" </tr>")
    Document.Write("</table>")
    Rem This is another example of a table
    Document.Write("<table border=0 width=550>")
    Document.Write(" <tr>")
    Document.Write(" <td width=100%>")
    Document.Write("<p>When we decided to leave, we knew we were ")
    Document.Write("making a hard decision. We had spent so much ")
    Document.Write("time this had become our new home. A few weeks ")
    Document.Write("or months before, we wanted to make <b>Sydney</b> ")
    Document.Write("our newly found settlement, a permanent place ")
    Document.Write("we could proudly call ours. It appeared that, ")
    Document.Write("<i>unpredictably</i>, fate had decided otherwise.</p>")
    Document.Write("<hr color=#FF9933>")
    Document.Write(" </td>")
    Document.Write(" </tr>")
    Document.Write(" <tr>")
    Document.Write(" <td width=100% align=right>")
    Document.Write("Author: Arthur D. Pale<br>")
    Document.Write("Title: Stories Of My Life")
    Document.Write(" </td>")
    Document.Write(" </tr>")
    Document.Write("</table>")
    </Script>
  2. Save the sydney.htm file and preview the web page in your browser
  3. Notice that the page still displays the same way.
    After previewing the page, return to Notepad
  4. To use a mix of Rem and single quote comments, change the file as follows:
     
    <Script Language="VBScript">
    Rem This exercise illustrates the use of HTML tags inserted into VBScript code
    Rem This is how to add a simple table made of one row and one column 
    Document.Write("<table border=0 width=550>")
    Document.Write(" <tr>")
    Document.Write(" <td width=100% align=center>")
    Document.Write("<font face=&quot;Garamond, Times New Roman, Georgia&quot; size=6 color=&quot;#FF0000&quot;>")
    Document.Write("<b>Leaving Sydney</b>")
    Document.Write("</font>")
    Document.Write(" </td>")
    Document.Write(" </tr>")
    Document.Write("</table>")
    Rem This is another example of a table
    ' This time, the table is made of two rows and one column
    Document.Write("<table border=0 width=550>")
    Document.Write(" <tr>")
    Document.Write(" <td width=100%>")
    ' This paragraph displays in the top cell
    Document.Write("<p>When we decided to leave, we knew we were ")
    Document.Write("making a hard decision. We had spent so much ")
    Document.Write("time this had become our new home. A few weeks ")
    Document.Write("or months before, we wanted to make <b>Sydney</b> ")
    Document.Write("our newly found settlement, a permanent place ")
    Document.Write("we could proudly call ours. It appeared that, ")
    Document.Write("<i>unpredictably</i>, fate had decided otherwise.</p>")
    Document.Write("<hr color=#FF9933>")
    Document.Write(" </td>")
    Document.Write(" </tr>")
    Document.Write(" <tr>")
    Document.Write(" <td width=100% align=right>")
    Document.Write("Author: Arthur D. Pale<br>")
    Document.Write("Title: Stories Of My Life")
    Document.Write(" </td>")
    Document.Write(" </tr>")
    Document.Write("</table>")
    </Script>
  5. Save and preview the file, then return to Notepad
 

Code Indentation

Code confined and heavily written can be hard to read. This will become even more difficult when we start adding variables, functions, and conditional statements. One remedy to making the code easier to read is to indent its sections. Although most (commercial) code editors assist programmers with code indentation, in Notepad, you will indent your code the way you want.

Indentation is similar to adding empty characters to a line of text by pressing Tab when starting a line of code. It can also be performed by press the Space bar at the beginning of a line of code. This leaves an empty space or empty spaces on the left side of the line being indented. Because indentation is not part of your code, it is a matter of choice and taste. One of the most common techniques is to indent a section by two or four empty characters from the previous section. To do this, in Notepad, press the Space bar two or four times and add your code. Here is an example:

<SCRIPT LANGUAGE="VBScript">
  Document.Write("<p>We went through a lot of trouble because of you.</p>")
</SCRIPT>

As you can see from the previous code, indentation of the Document.Write() calling allows you to know where the <SCRIPT> tag starts. Therefore, you will be able to know where a piece of code, such as the <SCRIPT> tag, must be closed.

Since your code will usually be made of different sections, a particular section of code should have the same level of indentation. Once again, this makes your code easier to read and navigate:

<SCRIPT LANGUAGE="VBScript">
  ' Movie Quote
  Document.Write("<p>We went through a lot of trouble because of you.<br>")
  Document.Write("You owe us.</p>") Rem Max starts having a stroke here
  Rem Display the movie title
  Document.Write("<b>Title:</b> Disorganized Crime")
</Script>
 

Practical Learning: Indenting Code

  1. To add indentation to your code, change the file as follows:
     
    <Script Language="VBScript">
      Rem This exercise illustrates the use of HTML tags inserted into VBScript code
      Rem This is how to add a simple table made of one row and one column 
      Document.Write("<table border=0 width=550>")
      Document.Write(" <tr>")
      Document.Write(" <td width=100% align=center>")
      Document.Write("<font face=&quot;Garamond, Times New Roman,     Georgia&quot; size=6 color=&quot;#FF0000&quot;>")
      Document.Write("<b>Leaving Sydney</b>")
      Document.Write("</font>")
      Document.Write(" </td>")
      Document.Write(" </tr>")
      Document.Write("</table>")
    
      Rem This is another example of a table
      ' This time, the table is made of two rows and one column
      Document.Write("<table border=0 width=550>")
      Document.Write(" <tr>")
      Document.Write(" <td width=100%>")
      ' This paragraph displays in the top cell
      Document.Write("<p>When we decided to leave, we knew we were ")
      Document.Write("making a hard decision. We had spent so much ")
      Document.Write("time this had become our new home. A few weeks ")
      Document.Write("or months before, we wanted to make <b>Sydney</b> ")
      Document.Write("our newly found settlement, a permanent place ")
      Document.Write("we could proudly call ours. It appeared that, ")
      Document.Write("<i>unpredictably</i>, fate had decided otherwise.</p>")
      Document.Write("<hr color=#FF9933>")
      Document.Write(" </td>")
      Document.Write(" </tr>")
      Document.Write(" <tr>")
      Document.Write(" <td width=100% align=right>")
      Document.Write("Author: Arthur D. Pale<br>")
      Document.Write("Title: Stories Of My Life")
      Document.Write(" </td>")
      Document.Write(" </tr>")
      Document.Write("</table>")
    </Script>
  2. Save and preview the file, then return to Notepad
 

Previous Copyright © 2004-2010 FunctionX, Inc. Next