Last active
July 2, 2024 18:33
-
-
Save baslie/7ab886423a9ca289aa59a24f66a92687 to your computer and use it in GitHub Desktop.
Скрываем или удаляем пустые карточки на Тильде (блок ST315N)
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- ******************************************************* --> | |
<!-- Скрываем или удаляем пустые карточки --> | |
<!-- ******************************************************* --> | |
<!-- Видео с пояснением: https://youtu.be/VLor5zp0W4s --> | |
<!-- ******************************************************* --> | |
<script> | |
(function() { | |
// Настройки | |
const productCardClasses = ['js-product', 't-item']; | |
const productNameClasses = ['js-store-prod-name', 'js-product-name', 't786__title']; | |
const storeClasses = ['t-store js-store', 't786']; | |
const keyword = 'Empty'; | |
const delay = 1000; | |
const checkInterval = 50; | |
const minScreenWidth = 960; | |
// Функция для выполнения проверок и скрытия или удаления элементов | |
function processEmptyProducts() { | |
// Проходим по всем указанным классам карточек | |
productCardClasses.forEach(productCardClass => { | |
// Находим все элементы с текущим классом карточки | |
const productCards = document.querySelectorAll(`.${productCardClass}`); | |
// Проходим по всем найденным элементам | |
productCards.forEach(productCard => { | |
// Проходим по всем указанным классам имен продуктов | |
productNameClasses.forEach(productNameClass => { | |
// Находим элемент с текущим классом имени продукта внутри карточки | |
const productName = productCard.querySelector(`.${productNameClass.split(' ').join('.')}`); | |
// Проверяем, если содержимое элемента равно keyword | |
if (productName && productName.textContent.trim() === keyword) { | |
if (window.innerWidth > minScreenWidth) { | |
// Скрываем элемент | |
productName.style.display = 'none'; | |
} else { | |
// Полностью удаляем элемент из DOM | |
productCard.remove(); | |
} | |
} | |
}); | |
}); | |
}); | |
} | |
// Функция для отложенного выполнения | |
function delayedProcessEmptyProducts(attempts = 0, maxAttempts = 100) { | |
// Проверяем, когда DOM полностью загружен, используя Тильдовскую t_onReady() | |
t_onReady(function () { | |
const storeElementExists = storeClasses.some(storeClass => document.querySelector(`.${storeClass.split(' ').join('.')}`)); | |
if (storeElementExists) { | |
// Устанавливаем задержку в delay миллисекунд | |
setTimeout(processEmptyProducts, delay); | |
} else if (attempts < maxAttempts) { | |
// Если элемент еще не найден и попыток меньше максимума, пробуем снова через checkInterval мс | |
setTimeout(() => delayedProcessEmptyProducts(attempts + 1, maxAttempts), checkInterval); | |
} | |
// Если достигнуто максимальное количество попыток, не делаем ничего | |
}); | |
} | |
// Запускаем проверку | |
delayedProcessEmptyProducts(); | |
// Проверка при изменении размера окна | |
window.addEventListener('resize', processEmptyProducts); | |
})(); | |
</script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment