Как создать кнопку «В корзину» и обновить товар, чтобы таблица соответствовала шапке? ⇐ Html

[Anonymous]

Сейчас я работаю над простым проектом, по сути, интернет-лавкой с фруктами. Сейчас я столкнулся с проблемой: моя текущая функция JS не может вызвать кнопку «Добавить в корзину» для обновления таблицы корзины покупок (т. е. когда я нажал ее, ничего не произошло).
Мне очень нужна ваша помощь в этом вопросе, я попробовал ChatGPT, но, похоже, он не дал мне правильного решения. Это моя текущая работа. Обратите внимание, что я пробую эту функцию на одном из продуктов, поэтому публикую только код арбуза
HTML

Код: Выделить всё

Sale!
[img]Images/watermelon.jpg[/img]
Watermelon
$5$2.50

Add to cart

shopping.js

Код: Выделить всё

/* ADD CELL AFTER PRESSING ADD TO CART */
function addToCart(productName, productPrice) {
console.log(productName + ', ' + productPrice);
// Get the table body where cart items will be added
var cartTableBody = document.querySelector('.shopping-cart');
console.log(cartTableBody)

// Create a new row for the cart item
var newRow = cartTableBody.insertRow();
console.log(newRow)

// Create cells for product name and price
var productNameCell = newRow.insertCell(0);
var productPriceCell = newRow.insertCell(1);

// Set the content of the cells
productNameCell.textContent = productName;
productPriceCell.textContent = '$' + productPrice.toFixed(2);
}

Текущая таблица создана с 1 образцом строки

Код: Выделить всё

 




Product
Price
Quantity
Subtotal



×


[img]Images/watermelon.jpg[/img]

Watermelon
$2.50


-+

Изображения для справки




Как вы можете Судя по двум изображениям выше, я хочу нажать кнопку «Добавить в корзину» арбуза, и содержимое карточек будет обновлено в корзине покупок, соответствующей заголовку таблицы.
Был бы очень признателен, если бы кто-нибудь мог мне с этим помочь. Вы всегда можете написать мне в Директ, чтобы обсудить! Спасибо!

Подробнее здесь: https://stackoverflow.com/questions/772 ... e-correspo