<button data-step="-1">left</button>
<button data-step="+1">right</button>
let pos = 0;
const
$slider = $('.slider'),
$blocks = $slider.find('.block'),
len = $blocks.length;
$('[data-step]').click(function() {
$blocks.filter('.active').removeClass('active');
pos = pos + +this.dataset.step;
$slider.css('transform', 'rotate(' + pos * 360 / len + 'deg)');
$blocks.eq(((-pos % len) + len) % len).addClass('active');
});
.search('\\(')
. Или один, если замените строку на литерал регулярного выражения: .search(/\(/)
. json.results.map(({ lists, volume }) => {
return lists.map(({ tags, list }) => {
return tags.map(tag => ({ volume, list, tag }));
});
}).flat(2)
const blockSelector = '.ingredient-b';
const inputSelector = 'input';
const className = 'display_none';
$(blockSelector)
.addClass(className)
.filter((i, n) => $(inputSelector, n).val())
.removeClass(className);
// или
document.querySelectorAll(blockSelector).forEach(n => {
n.classList.toggle(className, !n.querySelector(inputSelector).value);
});
$(blockSelector).on('input', inputSelector, e => {
$(e.delegateTarget).toggleClass(className, !$(e.target).val());
});
// или
document.querySelectorAll(`${blockSelector} ${inputSelector}`).forEach(function(n) {
n.addEventListener('input', this);
}, ({ target: t }) => t.closest(blockSelector).classList.toggle(className, !t.value));
function createTreeData(data, idProp, parentProp) {
const tree = Object.fromEntries(data.map(n => [ n[idProp], { ...n, children: [] } ]));
return Object
.values(tree)
.filter(n => !(tree[n[parentProp]] && tree[n[parentProp]].children.push(n)));
}
const createTreeHTML = data =>
Array.isArray(data) && data.length
? `<ul>${data.map(n => `
<li>
${n.name}
${createTreeHTML(n.children)}
</li>`).join('')}
</ul>`
: '';
const treeData = createTreeData(obj, 'id', 'parent_id');
const treeHTML = createTreeHTML(treeData);
document.body.insertAdjacentHTML('beforeend', treeHTML);
function filterByMinMax(arr, [ min, max ], key = n => n) {
const getVal = key instanceof Function ? key : n => n[key];
return arr.filter(n => {
const val = getVal(n);
return (min == null || min <= val) && (max == null || val <= max);
});
}
const d1 = filterByMinMax(chartPoints, [ new Date('2019-02-19') ], n => new Date(n.date));
const d2 = filterByMinMax(chartPoints, [ , '2019-01-23' ], n => n.date);
const d3 = filterByMinMax(chartPoints, [ '2019-02-12', '2019-02-26' ], 'date');
$(document).on('input', '.editor', function() {
const content = $('.editor')
.get()
.map(n => `\n <li>${$(n).html()}</li>`)
.join('');
$('textarea').val(`<ul>${content}\n</ul>`);
});
str.replace(/.{4}(?!$)/g, '$&-')
// или
str.match(/.{1,4}/g).join('-')
// или
str.split(/(?<=^(?:.{4})+)/).reduce((acc, n) => acc + (acc && '-') + n, '')
// или
''.concat(...[...str].map((n, i) => !i || i % 4 ? n : `-${n}`))
// или
Array.from(
{ length: Math.ceil(str.length / 4) },
(n, i) => str.slice(i * 4, (i + 1) * 4)
).join`-`
const items = document.querySelectorAll('.yourself-item__title');
const height = `${Math.max(...Array.from(items, n => n.clientHeight))}px`;
items.forEach(n => n.style.height = height);
.accordion__grandchild__item
, а переключаете видимость у родительских элементов - .accordion__grandchild__group
. Надо как-то устранить это печальное несоответствие. $('select').change(function() {
const v = this.value;
$('.sum').text($(`.element${v === '*' ? '' : `.${v}`}`).length);
});
document.querySelector('select').addEventListener('change', e => {
const v = e.target.value;
const s = '.element' + (v === '*' ? '' : '.' + v);
document.querySelector('.sum').textContent = document.querySelectorAll(s).length;
});
<select data-prop="type">
<option hidden></option>
<option value="type1">hello, world!!</option>
<option value="type2">fuck the world</option>
<option value="type3">fuck everything</option>
</select>
<br>
<input placeholder="name1" data-prop="name">
<input placeholder="name2" data-prop="name">
<input placeholder="name3" data-prop="name">
<br>
<input placeholder="url1" data-prop="url">
<input placeholder="url2" data-prop="url">
<input placeholder="url3" data-prop="url">
<br>
<input class="value" disabled>
<input class="value" disabled>
<input class="value" disabled>
const getValues = prop =>
Array.from(document.querySelectorAll(`[data-prop="${prop}"]`), n => n.value);
document.addEventListener('input', e => {
if (!e.target.dataset.prop) {
return;
}
const type = getValues('type')[0];
const names = getValues('name');
const urls = getValues('url');
document.querySelectorAll('.value').forEach((n, i) => {
n.name = n.value = `xxx[${type}][${names[i]}][${urls[i]}]`;
});
});
if (item.innerText === currentPage) {
item.innerText == currentPage
+item.innerText === currentPage
$('.input_1').each((i, n) => console.log(n, n.value ? 'я заполнен' : 'я пуст'));
console.log($('.input_1').get().some(n => n.value) ? 'кто-то заполнен' : 'все пустые');
console.log($('.input_1').toArray().every(n => n.value) ? 'все заполнены' : 'кто-то пуст');
console.log(Array.from($('.input_1')).filter(n => n.value), 'мы заполнены');
console.log([...$('.input_1').not((i, n) => n.value)], 'мы пустые');
function getDateInTimeZone(utcOffset, date = new Date()) {
const utcTime = date.getTime() + date.getTimezoneOffset() * 60000;
return new Date(utcTime + utcOffset * 3600000);
}
const moscowDate = getDateInTimeZone(3);
const newYorkDate = getDateInTimeZone(-5);
const tokyoDate = getDateInTimeZone(9);
const digital_root = num => num > 9
? digital_root([...`${num}`].reduce((acc, n) => acc + +n, 0))
: num;
const getNested = (obj, keys) => keys.reduce((p, c) => p?.hasOwnProperty(c) ? p[c] : null, obj);