.active .block {
border: 1px solid red;
color: red;
}
.active .under-box-text {
display: none;
}
.active .invisible {
display: block;
}const itemSelector = '.wrapper';
const buttonSelector = '.block, .link';
const activeClass = 'active';$(itemSelector).on('click', buttonSelector, e => {
$(e.delegateTarget).toggleClass(activeClass);
});
// или
document.querySelectorAll(itemSelector).forEach(function(n) {
n.querySelectorAll(buttonSelector).forEach(m => m.addEventListener('click', this));
}, e => e.currentTarget.closest(itemSelector).classList.toggle(activeClass));
// или
document.querySelectorAll(itemSelector).forEach(n => {
n.addEventListener('click', onClick);
});
function onClick(e) {
const button = e.target.closest(buttonSelector);
if (button) {
this.classList.toggle(activeClass);
}
}
// или
document.addEventListener('click', e => {
const button = e.target.closest(buttonSelector);
const item = button && button.closest(itemSelector);
item && item.classList.toggle(activeClass);
});{value >= 345 && value <= 500 ? <div>ничего нет</div> : null}будет ещё больше таких промежутков
const messages = [
{
values: [ 1, 2, 4, 8, 16, 32, 64, 128, 256, 512 ],
message: 'hello, world!!',
},
{
values: [ [ 5, 15 ], [ 100, 200 ], 333, 444, 555 ],
message: 'fuck the world',
},
{
values: [ [ 50, 150 ], [ 250, 350 ], [ 666, 999 ] ],
message: 'fuck everything',
}
];
...
<div>
{messages
.filter(n => n.values.some(v => (
(v instanceof Array && v[0] <= value && value <= v[1]) ||
v === value
)))
.map(n => <div>{n.message}</div>)
}
</div>data: () => ({
items: [ 'hello, world!!', 'fuck the world', 'fuck everything' ],
focused: null,
}),<div v-for="(n, i) in items">
<input @focus="focused = i" @blur="focused = null">
<span v-show="focused === i" v-text="n"></span>
</div>запрос_1()
.then(результат_1 => Promise
.all(результат_1.map(запрос_2))
.then(результат_2 => результат_1.map((значение_1, i) => ({
значение_1: значение_1,
значение_2: результат_2[i],
})))
)
.then(console.log)const getDayName = (day, lang) => (({
en: [ 'Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday' ],
ru: [ 'Воскресенье', 'Понедельник', 'Вторник', 'Среда', 'Четверг', 'Пятница', 'Суббота' ],
})[lang] || [])[day - (7 * Math.floor(day / 7))];
getDayName(5, 'en') // 'Friday'
getDayName(7, 'ru') // 'Воскресенье'
getDayName(-19, 'ru') // 'Вторник'
getDayName(4, 'fr') // undefinedconst getDayName = (day, lang) =>
new Date(2001, 0, ((day % 7) + 7) % 7).toLocaleString(lang, { weekday: 'long' });
getDayName(4, 'fr') // 'jeudi'
getDayName(36, 'de') // 'Montag'// можно посмотреть количество ключей
const isEmpty = x => !Object.keys(x || {}).length;
// или перебирать свойства, пока не встретится собственное
function isEmpty(x) {
for (const k in x) if (x.hasOwnProperty(k)) {
return false;
}
return true;
}isEmpty() // true
isEmpty(null) // true
isEmpty(666) // true
isEmpty('') // true
isEmpty([]) // true
isEmpty({}) // true
isEmpty([ 187 ]) // false
isEmpty({ xxx: 69 }) // false
isEmpty('hello, world!!') // falseawait Promise.all([ one(), query().then(commit) ])await Promise.all([ one(), query().then(r => (commit(), r)) ])const data = Array.from(
document.querySelectorAll('.bigDiv'),
n => Array.from(n.querySelectorAll('.smallDiv'), m => m.innerText)
);const data = [];
for (const n of document.getElementsByClassName('bigDiv')) {
data.push([]);
for (const m of n.children) {
data[data.length - 1].push(m.innerHTML);
}
}const data = Array.prototype.reduce.call(
document.getElementsByClassName('smallDiv'),
(acc, n) => (
n.previousElementSibling || acc.push([]),
acc[~-acc.length].push(n.textContent),
acc
),
[]
);.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}`;
});