Как выровнять по высоте заголовки в карточках товаров?

Для выравнивания заголовков в карточках товаров по высоте можно использовать различные методы, в зависимости от требований проекта. Ниже приведены несколько способов, как это можно реализовать с помощью JavaScript:

1. **Выравнивание с помощью вычисления максимальной высоты**:

const cards = document.querySelectorAll('.product-card');
let maxHeight = 0;

cards.forEach(card => {
    maxHeight = Math.max(maxHeight, card.querySelector('.product-title').offsetHeight);
});

cards.forEach(card => {
    card.querySelector('.product-title').style.height = `${maxHeight}px`;
});

Этот код найдет максимальную высоту заголовка среди всех карточек и применит эту высоту ко всем заголовкам, обеспечивая выравнивание.

2. **Использование библиотеки jQuery**:

Если проект уже использует jQuery, можно воспользоваться ее методами для упрощения выравнивания:

const heights = $('.product-title').map(function() {
    return $(this).height();
}).get();

const maxHeight = Math.max(...heights);

$('.product-title').height(maxHeight);

3. **CSS Flexbox**:

С использованием CSS Flexbox выравнивание по высоте можно реализовать без JavaScript:

.product-cards {
    display: flex;
}

.product-card {
    display: flex;
    flex-direction: column;
}

.product-title {
    align-self: stretch;
}

Эти способы позволят автоматически выравнивать заголовки карточек товаров по высоте, обеспечивая более красивый и последовательный внешний вид страницы.