document.addEventListener("DOMContentLoaded", function() {
const filters = document.querySelectorAll("[data-filter]");
Array.from(filters).forEach(filter => {
filter.addEventListener("click", function(event) {
event.preventDefault();
const categoryName = filter.dataset["filter"];
const categories = document.querySelectorAll("[data-cat]");
if (categoryName === "all") {
Array.from(categories).forEach(category =>
category.classList.remove("hide")
);
} else {
Array.from(categories).forEach(category => {
const workCat = category.dataset["cat"];
if (workCat !== categoryName) {
category.classList.add("hide");
} else {
category.classList.remove("hide");
}
});
}
});
});
});
а с приблизительными индикаторами. Где отображаются проценты и т.д.
Иванов И. И. из Бобруйска только что купил этот товар
<script>
function imtc_calculation() {
alert('imtc_calculation');
}
</script>
<button onclick="imtc_calculation();">CLICK</button>
<ul id="test">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
.red {
color: red;
}
const hours = new Date().getHours();
if (hours >= 9 && hours <= 15) {
document.querySelector('#test li:nth-child(3n)').classList.add('red')
}