Web Development: Input and Output using JavaScript

Objectives

Create websites that take in input via prompt and put that information back on the screen in various ways.

Instructions

Part 0: The Setup.

Create a folder on your hard disk named lastname_firstname_assignmentNo (where No is the assignment number). Save all the files from this assignment in this folder.

There are multiple parts to this assignment. You should put each piece into a single HTML document and separate the parts with a horizontal rule and a heading tag using the h1 element.

Each question in this assignment requires you to write a website that behaves as an application. The style for each page will be the same, but the HTML and JavaScript will be different. The focus of this assignment isnt CSS, but CSS is still required. Bland websites wont work. Also important: students should have different CSS files.

Each page should have the following components:

-A header section in which you announce the name of your application.

-Multiple sections that contain your applications.

-A footer in which you present your name and the copyright year.

These specifications are detailed enough for you to complete each question. However, youll need to use your best judgment on how to code many of the details. To do that, write the code in the way you think is best, based on the skills presented in the materials.

Question 2.

Everything in this question should go in the q2 folder. The file should be named index.html.

Make the title of this section: (Your Name)s Image Display Application.

Youll need to put an image file into your folder for this question. It will not be loaded into the page when the page initially loads.

Create one empty div element on the screen with the following id: myimage. Appropriately label each div element with text, letting the user know what the element represents.

Write one button on the screen.

When the user clicks the button, write a string containing the code to get an image to appear inside the div element named myimage.

-All you have to do is write a string containing the HTML code to produce an image to the myimage div.

-To do this, I create the code using the img tag to display the image somewhere on the screen using plain HTML. Then, while writing my JavaScript code, I remove this line and place the line inside of a string where Id write to the myimage div using innerHTML.