Question

Read the following problem: You order some groceries online and buy 5 things: Yellow Corn Tortillas...

Read the following problem:

You order some groceries online and buy 5 things:

  1. Yellow Corn Tortillas $3.32
  2. Cheddar Cheese $5.89
  3. Avocados $4.41
  4. Cilantro $0.99
  5. Jalapeno pepper $0.39

The website calculates the price and it is displayed as the "Subtotal".

The website charges 11% sales tax and it is displayed as the "Sales tax".

The overall price is calculated and it is displayed as the "Total price".

Based on the following HTML:

<table>
<caption>Details</caption>
<thead>
<tr><th>Item</th><th>Price</th></tr>
</thead>
<tbody>
<tr><td>Yellow Corn Tortillas</td><td id="price1">3.32</td></tr>
<tr><td>Cheddar Cheese</td><td id="price2">5.89</td></tr>
<tr><td>Avocados</td><td id="price3">4.41</td></tr>
<tr><td>Cilantro</td><td id="price4">0.99</td></tr>
<tr><td>Jalapeno pepper</td><td id="price5">0.39</td></tr>
</tbody>
<table>

<table>
<caption>Totals</caption>
<tbody>
<tr><td>Subtotal</td><td id="subtotal"></td></tr>
<tr><td>Sales tax</td><td id="salestax"></td></tr>
<tr><td>Total price</td><td id="total"></td></tr>
</tbody>
<table>
<p></p>

Write a JavaScript function to read the grocery item prices from the above HTML, calculate the Subtotal, Tax, and Total price, and then output the results back into the HTML.

Yes, write some JavaScript for this question!

HTML Editor Keyboard Shortcuts

0 0
Add a comment Improve this question Transcribed image text
Answer #1

Please find the code and sample outputs

<!DOCTYPE html>
<html>
<head>
</head>

<body>
<table>
<caption>Details</caption>
<thead>
<tr><th>Item</th><th>Price</th></tr>
</thead>
<tbody>
<tr><td>Yellow Corn Tortillas</td><td id="price1">3</td></tr>
<tr><td>Cheddar Cheese</td><td class="price"id="price2">2</td></tr>
<tr><td>Avocados</td><td class="price"id="price3">4</td></tr>
<tr><td>Cilantro</td><td class="price"id="price4">1</td></tr>
<tr><td>Jalapeno pepper</td><td class="price"id="price5">90</td></tr>
</tbody>
<table>

<table>
<caption onclick="sumTable()">Totals</caption>
<tbody>
<tr><td>Subtotal</td><td id="subtotal"></td></tr>
<tr><td>Sales tax</td><td id="salestax"></td></tr>
<tr><td>Total price</td><td id="total"></td></tr>
</tbody>
<table>
<p></p>


<script type="text/javascript">
  
   function sumTable() {
      
       var a = document.getElementById("price1").innerHTML;
       var b = document.getElementById("price2").innerHTML;
       var c = document.getElementById("price3").innerHTML;
       var d = document.getElementById("price4").innerHTML;
       var e = document.getElementById("price5").innerHTML;

       var SubTotal = parseFloat(a) + parseFloat(b) + parseFloat(c) + parseFloat(d) + parseFloat(e);
       console.log(SubTotal);
       var salesTax = parseFloat(SubTotal) * parseFloat(.11);
       console.log(salesTax)
       var Total = SubTotal + salesTax;
       console.log(Total);

       document.getElementById("subtotal").innerHTML = SubTotal;
       document.getElementById("salestax").innerHTML = salesTax;
       document.getElementById("total").innerHTML = Total;

  
   }

</script>

</body>


</html>

Please comment for any further clarifications.

Add a comment
Know the answer?
Add Answer to:
Read the following problem: You order some groceries online and buy 5 things: Yellow Corn Tortillas...
Your Answer:

Post as a guest

Your Name:

What's your source?

Earn Coins

Coins can be redeemed for fabulous gifts.

Not the answer you're looking for? Ask your own homework help question. Our experts will answer your question WITHIN MINUTES for Free.
Similar Homework Help Questions
  • I need help writting a Javascript function that does the following its for a HTML/CSS Shopping...

    I need help writting a Javascript function that does the following its for a HTML/CSS Shopping Cart Page CODE This page contains a list of the selected products that includes an image, name, price, quantity, and cost) Because the process is implemented not as real, three products along with its image and price are displayed on the page. The product ID of each product is stored in a hidden textbox. The default amount of each product is 1 and the...

ADVERTISEMENT
Free Homework Help App
Download From Google Play
Scan Your Homework
to Get Instant Free Answers
Need Online Homework Help?
Ask a Question
Get Answers For Free
Most questions answered within 3 hours.
ADVERTISEMENT
ADVERTISEMENT