[an error occurred while processing this directive] File: index.shtml Creator: George Ferguson Created: Tue Nov 13 19:31:40 2012 Time-stamp: [an error occurred while processing this directive] File: templates/doc-start.shtml Creator: George Ferguson Created: Tue Dec 6 12:31:29 2011 Time-stamp: [an error occurred while processing this directive] File: site-settings.shtml Creator: George Ferguson Created: Tue Dec 6 13:49:49 2011 Time-stamp: Site (or subsite)-wide settings. [an error occurred while processing this directive] [an error occurred while processing this directive] [an error occurred while processing this directive] [an error occurred while processing this directive] [an error occurred while processing this directive] File: head.shtml Creator: George Ferguson Created: Tue Dec 6 12:34:15 2011 Time-stamp: SSI variables for this template: head_title if given, else ``sitename | title'' [an error occurred while processing this directive] File: head-title.shtml Creator: George Ferguson Created: Tue Dec 6 14:29:52 2011 Time-stamp: SSI variables for this template: head_title: complete content of title element if given site_title trailing part of title (if given) section_title middle part of title (if given) page_title leading part of title (if given) title title shown on page, also used as leading part of title (if given) [an error occurred while processing this directive] (none) [an error occurred while processing this directive] File: head-meta.shtml Creator: George Ferguson Created: Tue Dec 6 14:29:18 2011 Time-stamp: SSI variables for this template: meta_description meta_keywords meta_generator [an error occurred while processing this directive] [an error occurred while processing this directive] [an error occurred while processing this directive] [an error occurred while processing this directive] File: head-stylesheets.shtml Creator: George Ferguson Created: Tue Dec 6 14:22:58 2011 Time-stamp: SSI variables for this template: site_stylesheet, page_stylesheet stylesheet0, stylesheet1, ...: URL for stylesheets [an error occurred while processing this directive] [an error occurred while processing this directive] [an error occurred while processing this directive] [an error occurred while processing this directive] [an error occurred while processing this directive] File: head-scripts.shtml Creator: George Ferguson Created: Tue Dec 6 14:23:19 2011 Time-stamp: SSI variables for this template: site_script, page_script script0, script1, ...: URLs of javascript scripts [an error occurred while processing this directive] [an error occurred while processing this directive] [an error occurred while processing this directive] [an error occurred while processing this directive] [an error occurred while processing this directive] File: body-start.shtml Creator: George Ferguson Created: Tue Dec 6 13:20:46 2011 Time-stamp: SSI variables for this template: body_class page_class page_id [an error occurred while processing this directive] [an error occurred while processing this directive] File: body-header.shtml Creator: George Ferguson Created: Tue Dec 6 13:46:12 2011 Time-stamp: Content above banner, if any. [an error occurred while processing this directive] File: body-banner.shtml Creator: George Ferguson Created: Tue Dec 6 13:27:12 2011 Time-stamp: Duplicate URCS Drupal banner. hajim urcs
Computer Science @ Rochester
Computer Science Department : Hajim School of Engineering & Applied Sciences Skip to main content
University of Rochester

Department of Computer Science

Page does not exist.

Missing Page

Sorry. The page that you requested does not exist on the Department of Computer Science web site.

Return to the CS Homepage

[an error occurred while processing this directive] File: body-title.shtml Creator: George Ferguson Created: Tue Dec 6 14:34:49 2011 Time-stamp: SSI variables for this template: section_name First line of title on page (if any) title Title shown on page

[an error occurred while processing this directive] DMS102/CSC170D: Introduction to Web Development
Spring 2013 [an error occurred while processing this directive]
Assignment 8: DOM

For each of the following questions, start with the example document linked here: dom-example.html. You can of course also experiment with other documents as you explore the DOM.
  1. [4 pts] Add a script element at the end of the document body that asks the user for some text and sets both the toplevel heading and the document title to that text.
  2. [4 pts] Add a script element at the end of the document body that asks the user for some text and adds it as a new item in the second list.
  3. [4 pts] Add a script element at the end of the document body that asks the user for an element id and then makes the element with that id (if any) disappear. Be sure to check that there is such an element. Lookup the display CSS property (and corresponding property of the element's style object) for how to make it disappear.
  4. [4 pts] Add a script element at the end of the document body that first asks the user for an element id. If there is such an element, ask the user for a color name and set the element's style object's color property to that color.
  5. [4 pts] Add a script element at the end of the document body that asks the user for an HTML class name and a color name, and then sets the color of all the elements of that HTML class to the given color.

Things to think about

  • You need to know the basic DOM methods for getting elements of the document: getElementById returns a single element (or undefined). getElementsByTagName and getElementsByClassName return (possibly empty) collections of elements (technically, these are NodeList objects).
  • You need to know how to iterate through the elements in the collections returned by getElementsByTagName and getElementsByClassName.
  • You need to know how to use an element's style property to change the element's appearance. The properties of a style object are the CSS properties, with the names adjusted to use Javascript identifiers (i.e., CamelCase rather than hyphens).
  • For this part of the assignment, we make our scripts run after the document has loaded by putting the code at the end of the body element. Very soon we'll learn how to trigger behaviors from mouse clicks and other events.

[an error occurred while processing this directive] File: doc-finish.shtml Creator: George Ferguson Created: Tue Dec 6 13:46:48 2011 Time-stamp: [an error occurred while processing this directive] File: body-footer.shtml Creator: George Ferguson Created: Tue Dec 6 14:43:56 2011 Time-stamp: Content at bottom of page, if any.

Last update: Friday, 05-Apr-2013 14:51:55 EDT

[an error occurred while processing this directive] File: body-finish.shtml Creator: George Ferguson Created: Tue Dec 6 13:47:36 2011 Time-stamp: [an error occurred while processing this directive]