Question: question regrading JQuery IT2320 - Lab 3 var items = []; var costs = []; // 2. Change all calls to document.getElementById to the jQuery
question regrading JQuery
var items = [];
var costs = [];
// 2. Change all calls to document.getElementById to the jQuery $ method
// 3. Replace the window.onload event with jQuery document(ready)
// https://www.w3schools.com/jquery/jquery_syntax.asp
window.onload = function() {
document.getElementById('newItem').focus();
}
function openTab(tabName) {
var i;
// 4. Change getElementsByClassName to the jQuery $ method
var x = document.getElementsByClassName("tab");
for (i = 0; i < x.length; i++) {
// 5. Change the following line style.display = "none" to hide()
// https://www.w3schools.com/jquery/jquery_hide_show.asp
x[i].style.display = "none";
}
// 6. Change the following line style.display = "block" to show()
https://www.w3schools.com/jquery/jquery_hide_show.asp
document.getElementById(tabName).style.display = "block";
}
function addItem() {
var newItem = document.getElementById('newItem').value;
var newAmount = parseFloat(document.getElementById('newAmount').value);
costs.push(newAmount);
items.push(newItem);
var itemsDisplay = "
| Item | Amount |
| " + items[i] + " | $" + costs[i].toFixed(2) + " |
itemsSummary += "
itemsSummary += "
itemsSummary += "
// 7. Change all .innerHTML properties to jQuery .html() get and set
// https://www.w3schools.com/jquery/jquery_dom_get.asp
// https://www.w3schools.com/jquery/jquery_dom_set.asp
// Example: $('#summary').html(itemsSummary);
document.getElementById('summary').innerHTML = itemsSummary;
document.getElementById('currentItems').innerHTML = itemsDisplay;
// 8. Change all .value properties to jQuery .val() get and set
document.getElementById('newItem').value = '';
document.getElementById('newAmount').value = '';
document.getElementById('newItem').focus();
}
Grocery List
Add to Shopping Cart
Description:
Amount:
Current Items
Summary
This is not a real company. It's a project completed in IT 2320 -
Interactive Internet Programming.
this is the instruction
## Instructions
1. Add jQuery using a CDN
2. Change all calls to document.getElementById to the jQuery $ method
3. Replace the window.onload event with jQuery document(ready)
4. Change getElementsByClassName to the jQuery $ method
5. Change the following line style.display = "none" to hide()
6. Change the following line style.display = "block" to show()
7. Change all .innerHTML properties to jQuery .html() get and set
Example: $('#summary').html(itemsSummary);
8. Change all .value properties to jQuery .val() get and set
Step by Step Solution
There are 3 Steps involved in it
Get step-by-step solutions from verified subject matter experts
