.hidden {
display: none;
}
const checkbox = document.querySelector('.block50 input');
const block = document.querySelector('.block83');
const onChange = e => block.classList.toggle('hidden', !e.target.checked);
checkbox.addEventListener('change', onChange);
список скрывается только после того, когда поставишь и уберешь галочку
<div class="block83 hidden">
checkbox.dispatchEvent(new Event('change'));
body:not(:has(.block50 :checked)) .block83 {
display: none;
}
document.querySelector('#myselect').addEventListener('change', function(e) {
const select = this;
// или
// const select = e.target;
// const select = e.currentTarget;
const [ option ] = select.selectedOptions;
// или
// const option = select[select.selectedIndex];
// const option = select.querySelector(`[value="${select.value}"]`);
// const option = select.querySelector('option:checked');
// const option = [...select.options].find(n => n.selected);
const forAttr = option.getAttribute('for');
// или
// const forAttr = option.attributes.for.value;
document.querySelector('#mydiv').innerText = `Вес брутто*: ${forAttr}`;
});
Promise
.all([...img].map(n => new Promise(r => n.complete ? r() : n.onload = r)))
.then(() => img.forEach(n => n.style.position = 'absolute'));
const intervals = [ 1000, 2000, 500, 3000 ];
let interval = -1;
function newsRotator() {
const $news = $('.news');
const $hidden = $news.not(':visible');
const $next = $hidden.eq(Math.random() * $hidden.length | 0);
$news.hide();
$next.show();
interval = (interval + 1) % intervals.length;
setTimeout(newsRotator, intervals[interval]);
}
newsRotator();
for(i = 0
i
должна быть объявлена. Погуглите, что происходит, если выполнить присваивание необъявленной переменной.i<= n;
newArr[i] = a[i];
function arrayNtimes(a, n) {
const result = [];
for (let i = 0; i < a.length * n; i++) {
result[i] = a[i % a.length];
}
return result;
}
const arrayNtimes = (a, n) => Array(n).fill(a).flat();
element.insertAdjacentHTML('beforebegin', html);
element.before(...new DOMParser()
.parseFromString(html, 'text/html')
.body
.childNodes
);
// или
element.parentNode.insertBefore(
document.createRange().createContextualFragment(html),
element
);
element.outerHTML = html + element.outerHTML;
const titleCase = str => str
.split(' ')
.map(n => n.charAt(0).toUpperCase() + n.slice(1).toLowerCase())
.join(' ');
const titleCase = str => str
.toLowerCase()
.replace(/(?<=^| +)./g, m => m.toUpperCase());
const titleCase = str =>
''.concat(...Array.from(str, (n, i) => {
return n[i && str[~-i] !== ' ' ? 'toLowerCase' : 'toUpperCase']();
}));
(() => {}) instanceof Object // true
const container = document;
const selector = 'input[type="checkbox"]';
const sumElements = elements =>
Array.prototype.reduce.call(elements, (acc, n) => acc + +n.value, 0);
const onSumChange = sum => console.log(sum);
container.addEventListener('change', function({ target: t }) {
if (t.matches(selector)) {
onSumChange(sumElements(this.querySelectorAll(`${selector}:checked`)));
}
});
container.querySelector(selector).dispatchEvent(new Event('change', { bubbles: true }));
const cb = container.querySelectorAll(selector);
let sum = sumElements(Array.prototype.filter.call(cb, n => n.checked));
const onChange = e => onSumChange(sum += e.target.value * [ -1, 1 ][+e.target.checked]);
cb.forEach(n => n.addEventListener('change', onChange));
onSumChange(sum);
str.slice(1).split('&').reduce((acc, n) => (n = n.split('='), acc[n[0]] = n[1], acc), {})
// или
[...str.matchAll(/(\w+)=([^&]*)/g)].reduce((acc, [ , k, v ]) => ({ ...acc, [k]: v }), {})
// или
Object.fromEntries(new URLSearchParams(str))
const STAGES = {
2: 'itemGv',
5: 'itemTm',
};
for (const [ key, val ] of Object.entries(items)) {
const s = STAGES[val.stage];
if (s) {
this.client.srem('items', key);
this.emit(s, val);
}
}
const XXX = length => Array
.from({ length }, (n, i) => Array
.from({ length: i + 1 }, (n, i) => i + 1)
.join(','))
.join('\n');
console.log(XXX(5));
const XXX = length => Array
.from({ length }, function() {
this.push(-~this.length);
return this.join`,`;
}, [])
.join`\n`;
const XXX = length => Array
.from({ length }, (n, i) => Array
.from(Array(++i).keys())
.reduce((acc, n) => acc + (acc && ',') + ++n, ''))
.reduce((acc, n) => acc + (acc && '\n') + n, '');
const SKILLS = {
sport: [ 'running', 'squats', 'snowboarding' ],
music: [ 'guitar', 'drums' ],
};
const filterBySkill = (people, filter) =>
people.filter(({ skills }) =>
skills.every(n => filter.some(m => SKILLS[m].includes(n))) &&
filter.every(n => skills.some(m => SKILLS[n].includes(m)))
);
<div id="time"></div>
function setTimer(el, template) {
return setInterval(el => {
const d = new Date();
const timeData = Object.fromEntries([
[ 'h', 'getHours' ],
[ 'm', 'getMinutes' ],
[ 's', 'getSeconds' ],
].map(n => [ n[0], `${d[n[1]]()}`.padStart(2, 0) ]));
el.innerHTML = template.replace(
/\$(\w)/g,
(m, g1) => timeData.hasOwnProperty(g1) ? timeData[g1] : m
);
}, 1000, typeof el === 'string' ? document.querySelector(el) : el);
}
const intervalId = setTimer('#time', '<strong>Сейчас</strong> $h:$m:$s');
function sortChildren(el, key) {
el.append(...Array
.from(el.children, n => [ n, key(n) ])
.sort((a, b) => a[1] - b[1])
.map(n => n[0])
);
}
sortChildren(document.querySelector('.menu'), n => +n.dataset.num);