LIS 390W1A - Javascript Exercise #2: Variables & Arrays

Quick Admin Work

As part of class today, I need everyone to complete the following task. If you are not in class today, you still need to complete these steps on your own. What this will do is create a file that will allow you to change the permissions of files in your directories and have them stick. This is a GSLIS-system-specific task.

  1. Open a terminal window, or, if you are using windows, open an SSH client (either SSH or PuTTY; see the Course Technologies page for more info).
  2. SSH into one of the classroom servers.
    • On Macs: type in the following command at the command prompt (without the % sign - the % sign indicates that you are at a command prompt when typing):

      % ssh netid@classrm03.lis.uiuc.edu
      				

      Remember to substitute your NetID for "netid", and you can pick any of the classroom servers to ssh into; remember, they run from 01 to 05 (e.g., classrm01.lis.uiuc.edu).

    • On Windows: fill out the appropriate boxes in the connect window. There should be a box that says "user name" and a box that says "server" or something like that. Type in your NetID into the "user name" box and the url of one of the classroom servers into the "server" box (see the Mac instructions above).
  3. Type in your GSLIS password at the prompt.
  4. Once you are successfully connected, type in (or copy and paste) the following command at the prompt - be sure to substitute your NetID for "netid":

    % cd /homei/users/netid
    		
  5. Type in "pwd" and hit enter to make sure that you are in the right path.
  6. Type in the following command (and hit enter):

    % touch .keepperms
    		

    This should create an empty file called ".keepperms". All files in unix that start with a period (a ".") are hidden files. Therefore, if you type in "ls" to list all the files, you will not see it. Type in "ls -a" (the -a means "all"), and you will see it. Type in "ls -al" and you will see the long format description of all the files. Personally, I rarely use -a without -l.

    To learn more about any command, simply type in "man commandname" where "commandname" is the name of the command. Thus, to learn more about the "touch" command, type in "man touch", to learn more about the "ls" command, type in "man ls", etc.

  7. Type in the following commands, one at a time, and be sure to keep the capitalization the same as what is written below (the command-line is case sensitive):

    % chmod o+rx .
    % chmod o+rx courseweb_html
    % chmod -R o+r courseweb_html
    		

    This changes the permissions on all your files and directories in your courseweb directory (-R stands for "recursive") so that they are read accessible, and it makes your username directory and your courseweb directory navigable (the x stands for executable).

  8. Now type in the following commands:

    % cd courseweb_html
    % find . -type d -exec chmod o+rx '{}' ';'
    		

    This will find all the directories in your courseweb_html directory, and change their permissions to be both readable and browseable.

Javascript Exercise

For this exercise, you may wish to dowload (right-click, "save as...") js_ex_2.html and js_ex_2.css, and use them to follow along in this exercise. Before we begin this exercise, there are several things you ought to know.

  • Javascript is case sensitive. This means that it is very important that you use uppercase and lowercase letters consistently. If you are using predefined javascript functions, then be sure to get not only the spelling right, but the cases right.
  • When you use javascript in your pages, be sure to use the following form in your script tags:

    <script type="text/javascript">
    /* <![CDATA[ */
    	// Insert javascript here.
    /* ]]> */
    </script>
    		

    The justification for this is covered nicely in the article Javascript and XHTML. The basic idea is that if you parse the data within the script tags (i.e. consider it to be PCDATA = "parsed character data" - which is the default), then the browser or validator may/will (correctly) interpret the HTML tags within the script tags as HTML tags, rather than as character data that is to be used by the javascript, and the javascript alone. Thus, you want to explicitly identify the data within the script tags as character data (CDATA), not parsed character data (PCDATA). The "/*" and "*/" are the begin and end comment tags for javascript, which is important so that the javascript interpreter in your browser doesn't interpret the "<![CDATA[" or the "]]>" as javascript code, which it is not.

  • Javascript is technically a scripting language. For a really good account of the difference between scripting languages and programming languages, read the blog post: Scripting vs. programming: is there a difference?

    The short answer is that there's not much difference, but one thing to note is that javascript is processed each time a page is loaded. The significance of this for javascript as opposed to other scripting languages, however, is that it is processed by the browser, not by a program which processes it before it gets to the browser. As a result, debugging javascript can often be extremely difficult, because the only output you can see is what gets presented on the screen. If you view source, you still can't see the DOM manipulation, etc., which your javascript might (almost certainly is) doing.

    Another difference is that you can't create a "program" with javascript. This isn't such a big deal, but it means that you can't do certain things with javascript which you can do with other languages. Thus, while both might be turing-complete, this only means that you can create identical kinds of functionality. It doesn't mean that you can address, point to, refer, or affect the same (kinds of) objects with whatever functionality you create.

    Lastly, you should realize that the term "programming language" really has two senses. One is the specific sense described in the blog post referenced above, as a contrasting category to "scripting language". The other is as a super-category that covers all kinds of (turing-complete, computational) languages, including both scripting languages and programming languages in the specific sense of "programming language". Thus, when people talk about "web programming", they are using the more general sense of programming. From now on, unless specifically contrasting scripting with programming languages, I will be using "programming" in its more general sense.

  • Because javascript debugging can be a huge pain, if you are doing anything serious in javascript, I recommend you install the Firebug firefox extension. This is a debugging tool that is integrated into firefox to help you find the errors that can occur.