jQuery Dom Manipulation

Student project manipulating the DOM by creating, removing and modifying elements with jQuery

jQuery

Overview

This class project was part of the Web Development Certificate program at Seattle University. Original assignment details below:

Assignment

An assignment designed to demonstrate the ability to manipulate the DOM by creating, removing and modifying elements.

In order to practice DOM manipulation with the help of jQuery, we will fill in information and interactive actions on a page just as we would on a regular website. We will use a Javascript Object called userProfile to provide imaginary user profile information, as if that had been delivered via an Ajax (XHR) request or some other server mechanism. We will also improve the interactivity of the content by providing some show/hide features and style updating.

Base Requirements:

In order to successfully complete this assignment, you need to fulfill these goals:

  • Create a pseudo-login effect by replacing the login form with some mock user data when the user clicks the “login” button.
  • Activate all the “view details” buttons so that they show the appropriate hidden content (marked with the details class) when clicked, and then hide the same content when clicked again.
    • Alter the text of the “view details” button that was clicked so it becomes “hide details” and allows the user to understand that these buttons work to toggle the display of content.
  • Activate the vote buttons so they properly register, count, and display voting activity. (NOTE: For the basic requirements, these votes do not need to persist across page refreshes, and each user should be able to vote multiple times.)
  • Project TypeStudent Project
  • RoleFront End Web Development
  • ToolsCode Editor, GitHub
  • DeliverablesManipulated Site
View Site
Interested in more details?

Learn more about this project

View Site