Java程序辅导

JavaScript Lab 1 
 (50 pts) 
Complete JavaScript Tutorials 1 and 2. 
Turn in the following: 
From Tutorial 1: 
An html file and a js file.  
A. (5 pts) The html file should have a table with 4 data cells, each with an image in it.  Each image 
should, when clicked on, call its own function in your .js file such that an alert box pops up saying 
what image you clicked on. 
The html file should have buttons that call generalizedfunc() with different sentences. 
The javaScript file should have the generalizedfunc(x) that uses an alert box to print out the 
different sentences passed in by the buttons 
B. ( 5 pts) A second table – a copy of the first table, with each image only calling the same function 
when clicked on, with the name of what the image is as a parameter to the function.  In your 
javascript file, this function should use the alert box to print out what the image is by using the 
parameter. 
C. (12 pts) Either in separate html and .js files or the same ones you’ve been using, you should have 
a javascript that asks the user, “what kind of candy do you like?” using the prompt box.  The 
function should then use an if condition to print out what your favorite candy says about you as 
follows: 
 Snickers -> you have a multi-faceted personality.  You don’t fit into a box.  You like to travel and read 
as much as TV and sports.   
 100 Grand -> you’re wise beyond your years.  You were always the kind in class teachers were most in 
pressed with.  You question things in a thoughtful way 
 MilkyWay-> you’re smooth!  You know what to say and when to say it.  You love a minimal, clean 
look.  You enjoy cooking more than going out 
 3 Musketeers -> You’re a hero.  You’re super humble and unassuming.  You read long books 
 Butterfingers->you’re a little clumsy.  You tend to lose stuff.  Your favorite show is the Simpsons and 
you identify with Bart. 
 Candy Corn - >you probably need braces.  You like cats. 
 Reese’s Peanut Butter Cups -> You’re a free spirit.  You have a strong sense of self, and enjoy being 
around people who challenge you.   
 Smarties-> You’re the quiet, loving type.  You treat everything with respect.  You’re an introvert and 
you enjoy cooking with close friends. 
 Nerds -> You’re a total goofball.  You might not always be funny, but everyone knows they’ll have a 
good time when you’re around.  You’re weird in a good way.  You’re probably a morning person. 
 Starbursts -> you’re the creative type.  You like taking risks and stretching yourself in new, artistic 
fields.  You like living near nature. 
 M&Ms ->you’re a model citizen.  You always recycle.  You’re always up for an adventure. 
 Kit Kat -> you’re cool, and super laid back.  You go with the flow.  You love traveling 
 Nestle crunch -> You’re a dreamer.  You always have a positive attitude.  You’re not too hard on 
yourself. 
 None of the above -> You’re picky.  You know what you want and you are willing to wait to get it.  
Fine, but you’re missing out on a lot of good candy! 
Note that this should be in the form of: 
if (y === ‘snickers’) { 
 alert(“you have a multi-faceted personality.  You don’t fit into a box.  You like to travel and read as much 
as TV and sports.”) 
} 
else if (y === ‘100 grand’) { 
 alert(“you’re wise beyond your years.  You were always the kind in class teachers were most in pressed 
with.  You question things in a thoughtful way”) 
} 
else if (y ===”MilkyWay”) { 
 alert(“you’re smooth!  You know what to say and when to say it.  You love a minimal, clean look.  You 
enjoy cooking more than going out”) 
} 
Etc. 
From Tutorial 2: 
You can either make a new html and .js file, or modify the ones you used in Tutorial 1 
A. (5 pts) In the .js file, add a function that, instead of using a parameter, uses the prompt and a variable to 
get the input for document.write to write out.  The prompt box should ask the user, “what is your favorite 
movie?” and then document.write should write out what the user typed in in as a 
 item.  In your html 
have either a paragraph or a button call the function to test it. 
B. (7 pts) Your html file should have 3 paragraphs, one for small, one for medium, and one for large.  The 
small should call a function with a relatively small number as the input value.  The medium should call the 
same function with a larger number as the input value, and the large should call the same function with 
the largest number. 
Your js file should hold the function called by the above paragraphs.  Using the input parameter, it should 
modify the font of the paragraph printed out using document.write so that its size is the size of the input 
parameter.  
2. (8 pts) In this function (or in a separate function), you should have a prompt box that asks the user, “do you 
prefer regular, or italic font?”   and uses what the user types in to modify the paragraph.  So, for instance, if the 
user types in, “italic”, the prompt’s variable should be used to write out a paragraph (anything you want, maybe a 
nice quote) with the font-style set to italic.  Make sure in the html something (either an existing paragraph or a 
new paragraph or button) calls this function so that you can test it. 
3. (8 pts) Make sure you’ve downloaded 4 images and saved them in the same folder as your .js file.  The images 
should be for the 4 seasons (or any 4 distinct entities you prefer).  Your JS file should have a new function that has 
an input parameter.  The function should work as follows:  
 If the input parameter holds the word “autumn”, document.write should write the html to display the 
image you downloaded of autumn.   
 If the input parameter holds the word “winter”, document.write will write the html to display the 
image of winter.   
 If the input parameter holds “spring”, document.write will write the html to display the image of 
spring, and 
 if the input parameter holds “summer”, document.write will write the image of summer. 
Make sure your  web page has 4 paragraphs on it.  Each paragraph should call  the above function with 
“autumn”,”winter”,”spring”, or “summer” respectively. 
 Zip up all images, html, and .js files needed for this lab and submit on canvas.  
NOTE: For this lab, you don’t have to upload to the university’s server and upload to canvas 
the URL. You may just submit the zipped file to canvas.