Как сделать удаление карточек товаров из корзины?

Для реализации удаления карточек товаров из корзины на странице с помощью JavaScript, вам потребуется выполнить следующие шаги:

1. **HTML разметка**: добавьте кнопку удаления на каждую карточку товара в корзине. Пример разметки карточки товара:

<div class="cart-item">
    <img src="product-image.jpg" alt="Product">
    <h3>Product Name</h3>
    <p>$20.00</p>
    <button class="delete-button" data-product-id="1234">Delete</button>
</div>

2. **JavaScript код**: напишите скрипт, который будет обрабатывать клик по кнопке удаления и удалять соответствующую карточку товара из корзины. Пример скрипта:

document.addEventListener('DOMContentLoaded', function() {
    const deleteButtons = document.querySelectorAll('.delete-button');
    
    deleteButtons.forEach(button => {
        button.addEventListener('click', function() {
            const productId = button.getAttribute('data-product-id');
            const cartItem = button.closest('.cart-item');
            
            // Удаление карточки товара из DOM
            cartItem.remove();

            // Дополнительно можно добавить логику для удаления товара из корзины в бэкенде
            
            // Пример запроса на сервер для удаления товара из корзины
            /*
            fetch(`/cart/${productId}`, {
                method: 'DELETE' 
            })
            .then(response => {
                if (response.ok) {
                    // Дополнительные действия при успешном удалении товара
                } else {
                    // Обработка ошибки удаления товара
                }
            })
            .catch(error => console.error('Error deleting product:', error));
            */
        });
    });
});

3. **Дополнительно**: если карточки товаров добавляются динамически, например, при клике на кнопку "Добавить в корзину", то необходимо использовать делегирование событий для правильной работы обработчика удаления.

Таким образом, следуя этим шагам, вы сможете реализовать удаление карточек товаров из корзины на странице с помощью JavaScript.