Do the following:
1. Use your code editor to open the project03-04_txt.html and
project03-04_txt.js files from the js03 c
project04 folder. Enter your name and the date in the comment
section of each file and save them as
project03-04.html and project03-04.js, respectively.
2. Go to the project03-04.html file in your code editor and in the
head section add a script element to load the
project03-04.js file, deferring the loading of the JavaScript
source file until the entire HTML file is loaded. Study
the contents of the HTML file and save your changes.
3. Go to the project03-04.js file in your code editor. At the
bottom of the file, insert a function named starImages()
with a single parameter named rating. The purpose of the function
is to generate the HTML tags of several star
images based on the value of the rating parameter.
4. Within the starImages() function add the following:
a. Declare a variable named imageText, setting its initial value to
an empty text string.
b. Create a for loop with a counter that goes from 1 up to less
than or equal to the value of the rating
parameter, increasing the counter by 1 with each iteration.
c. In the for loop, add the text "<img src = 'star.png' alt =
">" to the value of the imageText
variable with each iteration.
d. After the for loop, add a statement to return the value of
imageText from the function.
5. Create a for loop with the counter variable ranging from 0 up to
less than the length of the reviewers array,
increasing the counter by 1 with each iteration. In this for loop
you will generate the HTML code for a table
that contains the review from each customer.
6. For each iteration within the for loop, do the following:
a. Declare a variable named reviewCode, setting its initial value
to an empty text string.
b. Insert an else if statement that adds one of three possible text
strings to the value of reviewCode: if
the value of the reviewType for the current element in the array is
equal to "P" then add the text string
"<table class = 'prime'>", else if the value of the
reviewType for the current element is equal to
"N" then add the text string,"<table class = 'new'>" else add
the text string, "<table>".
c. Add the following HTML code to the value of the reviewCode
variable. (Hint: You may find it easier to
break this code into several text strings that you add separately
using the += assignment operator.)
<caption>reviewTitles</caption>
<tr><th>By</th><td>reviewers</td></tr>
<tr><th>Review
Date</th><td>reviewDates</td></tr>
<tr><td
colspan='2'>reviews</td></tr>
</table>
where reviewTitles, reviewers, reviewDates, and reviews
are the values from the
reviewTitles, reviewers, reviewDates, and reviews arrays for the
current element in the iteration.
d. Use the insertAdjacentHTML() method to insert the value of the
reviewCode variable into the
first (and only) <article> tag in the document, placing it
directly before the closing tag. (Hint: Use the
getElementsByTagName() method to reference the collection of
article elements in the document.)
7. Save your changes to the file and then load project03-04.html in
your web browser, verify that all four reviews
are shown as indicated in Figure 3-21.
Copyright
Do the following: 1. Use your code editor to open the project03-04_txt.html and project03-04_txt.js files from the js03
-
answerhappygod
- Site Admin
- Posts: 899604
- Joined: Mon Aug 02, 2021 8:13 am
Do the following: 1. Use your code editor to open the project03-04_txt.html and project03-04_txt.js files from the js03
Join a community of subject matter experts. Register for FREE to view solutions, replies, and use search function. Request answer by replying!