CS 312 - Internet Concepts
Fall 2011: Tues/Thurs 3-4:15pm, Dragas 1117

Print - Admin





Useful Links

Project 3 - XML

Assigned: Thursday, November 3, 2011
Due: Tuesday, November 15, 2010 before midnight

The goal of this assignment is to continue working towards the final project -- a set of webpages that allow a user to manage and search a personal media collection (CDs, MP3s, DVDs, video games, etc.).


In this assignment, you will be creating an XML file to hold information about the items in your media library. You will also use JavaScript to display a table of all of the items in your XML file on your media library home page. This will replace the table you hard-coded in Project 1.


Note: These are the items that we will check for when grading your assignment. Each is worth 10 points, unless otherwise indicated.

  1. Design an XML format suitable for holding a catalog of the media type that you chose for your webpages. You may choose your own elements, but at least 5 elements are required (such as artist, title, year, etc.), including a URL for the media artwork.
  2. Create the XML file and populate it with at least 5 entries.
  3. Your XML must pass validation. You'll need to copy/paste your XML file into the page, using a URL won't work.
  4. [20 points] Edit the home page to display a table of the elements in the XML file. Not all elements must be displayed, but enough should be displayed so that the user can quickly glance at the collection. This table replaces the hard-coded table from Project 1 and must be coded in JavaScript and read from the XML file.
    • You should create an external JavaScript file (different from the one used in Project 2) to hold the needed JavaScript functions. Make sure to include it in your index.html file.
    • In the JavaScript file, you will need to declare the global variable xmlhttp and write a function that accesses the XML file to write the table.
    (MCW 11/15/11) For this assignment, you do not need to declare the global variable xmlhttp.
  5. The table of the elements must include a thumbnail image of the media artwork (with the URL pulled from the XML file) that is clickable and links to either a full-size version of the artwork or another URL related to the media (same requirement as in Project 1).
  6. In the footer section of the home page, use JavaScript to indicate the date the page was last modified (hint: document.lastModified). This should replace the date you hard-coded in Project 1.
  7. In the footer section of the home page, add a link to your XML file.
  8. The HTML of your home page must pass XHTML 1.0 Transitional validation.
  9. Create a document with the tree structure of your XML file (just structure, not individual entries) and submit a hard-copy in class on Tuesday, Nov 15.

Your home page should look the same (or, at least, very similar to) the home page created for Project 1, but the table must be drawn using JavaScript and pull the data from your XML file.

Setting Up

  1. Create a new directory under ~/public_html/cs312/ for this project
    • chmod 755 ~/public_html/cs312/new directory name
  2. Copy the files you created in Project 2 over to this directory.
  3. Make sure that the directory and file permissions allow anyone to view the files.


  • Note: Your project will be graded using the Firefox browser.
  • Edit your HTML and CSS with a simple text editor (no Word or any other fancy tools allowed).
    • examples: emacs (on Unix machines), pico (on Unix machines), Notepad++ (on CS Windows machines)
  • Remember to use tags that are acceptable for XHTML (all lowercase and include closing tags when required).
  • All work must be your own.


Go to the Project 3 Submission page, and enter your name and the URL of your Project 3 home page (must start with http://www.cs.odu.edu/).

  • Make sure that the URL works before you submit it.
  • Only submit your URL once!