const li = document.querySelectorAll('li');
li.forEach(n => n.addEventListener('click', onClick));
function onClick(e) {
e.preventDefault();
li.forEach(n => n.classList.toggle('active', n === this));
const href = this.querySelector('a').getAttribute('href');
document.querySelector(href).scrollIntoView({
behavior: 'smooth',
});
}
let parent = document.querySelector("ul");
let child = document.querySelectorAll("ul li");
let anchors = document.querySelectorAll('a[href*="#"]');
for (let anchor of anchors) {
anchor.addEventListener("click", function (e) {
e.preventDefault();
for (let i = 0; i < child.length; i++) {
child[i].classList.remove("active");
}
e.target.classList.add("active");
this.parentNode.classList.add("active");
let blockID = anchor.getAttribute("href").substr(1);
document.getElementById(blockID).scrollIntoView({
behavior: "smooth",
block: "start"
});
});
}
arr.filter(nam(20,50))
// это то же самое:
arr.filter(function (x) { return x >= 20 && x <= 50; })
// или так:
function f(x) {
return x >= 20 && x <= 50;
}
arr.filter(f)
.filter(f)
применит функцию f
по очереди к каждому элементу массива. Т.е. вызовет функцию f(10), f(20), ... f(70)
f(элемент)
вернул true
. let el = document.getElementById('a');
function func(){
let timeId;
const handleScroll = () => {
let scrollPos = window.pageYOffset;
document.getElementById('z').innerHTML = scrollPos;
if(scrollPos > 600) {
if(!el.classList.contains('timer')) {
el.classList.add('timer');
let b = 60;
timeId = setInterval(() => {
b--;
el.innerHTML=b;
if(b == 0){
el.classList.remove('timer');
clearInterval(timeId);
alert('Отлично!');
}
}, 1000);
}
} else {
console.warn('stop');
clearInterval(timeId);
}
}
window.addEventListener('scroll', handleScroll);
}
func();
let btn = document.querySelector('#button1');
let elements = document.querySelectorAll('.test');
btn.addEventListener('click', changeColor);
function changeColor() {
for (let element of elements) {
elements.classList.toggle('color1');
}
}
.hidden {
display: none;
}
const filter = document.querySelector('.filter');
filter.addEventListener('change', function() {
document.querySelectorAll('.cart-product').forEach(function(n) {
n.classList.toggle('hidden', this.length && !this.includes(n.dataset.category));
}, Array.from(this.querySelectorAll(':checked'), n => n.dataset.filter));
});
filter.dispatchEvent(new Event('change'));