document.querySelector('.copybox').addEventListener('click', ({ target: t }) => {
if (t.tagName === 'BUTTON') {
navigator.clipboard.writeText(t.previousElementSibling.textContent);
}
});
const groupedAndUnique = Object.entries(arr.reduce((acc, n) => {
(acc[n.category] = acc[n.category] ?? new Set).add(n.type);
return acc;
}, {}));
document.body.insertAdjacentHTML('beforeend', `
<ul>${groupedAndUnique.map(([ k, v ]) => `
<li>
${k}
<ul>${Array.from(v, n => `
<li>${n}</li>`).join('')}
</ul>
</li>`).join('')}
</ul>`
);
const ul = document.createElement('ul');
ul.append(...groupedAndUnique.map(([ header, items ]) => {
const li = document.createElement('li');
li.append(header, document.createElement('ul'));
for (const n of items) {
li.lastChild.append(document.createElement('li'));
li.lastChild.lastChild.textContent = n;
}
return li;
}));
document.body.append(ul);
$('.chosen-select')
.find(`option[data-value="${category}"]`)
.prop('selected', true)
.end()
.trigger('chosen:updated');
$owl.on('mouseenter mouseleave', function(e) {
$(this).data('owl.carousel').options.autoplay = e.type === 'mouseenter';
$(this).trigger('refresh.owl.carousel');
});
$owl.on('mouseenter mouseleave', function(e) {
$(this).trigger(({
mouseenter: 'play',
mouseleave: 'stop',
})[e.type] + '.owl.autoplay');
});
const index = вам виднее, что тут должно быть;
const className = 'header';
const selector = `.${className}`;
const key = 'id';
const attr = `data-${key}`;
const parentSelector = 'table tbody';
):const $elements = $(parentSelector).children();
const $el = $elements.eq(Math.min(index, $elements.length - 1));
const val = ($el.is(selector) ? $el : $el.prev(selector)).attr(attr) ?? null;
// или
const elements = document.querySelector(parentSelector).children;
let val = null;
for (let i = Math.min(index, ~-elements.length); i >= 0; i--) {
if (elements[i].matches(selector)) {
val = elements[i].getAttribute(attr);
break;
}
}
const elementsSelector = 'table tr';
) разные (конкретно в вашем случае это могла бы быть таблица с несколькими tbody
):const val = $(elementsSelector)
.slice(0, index + 1)
.filter(selector)
.last()
.data(key) ?? null;
// или (UPD. На момент публикации вопроса метод findLast отсутствовал,
// вместо него использовалась связка из reverse-find)
const { [key]: val = null } = Array
.from(document.querySelectorAll(elementsSelector))
.slice(0, -~index)
.findLast(n => n.classList.contains(className))
?.dataset ?? {};
Uncaught TypeError: number[i].parents is not a function
number[i]
должно было быть $(number[i])
или number.eq(i)
.$('.person-wr a.desc')
.filter((i, n) => !$(n).text().trim())
.closest('.add-info')
.hide();
document.querySelectorAll('.person-wr a.desc').forEach(n => {
n.closest('.add-info').hidden = !n.text.trim();
});
const itemSelector = '.preliminary-item';
const keys = [ 'name', 'quantity', 'proximity' ];
const sourceSelector = key => `.request-${key}`;
const targetSelector = key => `.result-${key}`;
$(document).on('click', itemSelector, function() {
$.each(keys, (i, n) => {
$(targetSelector(n)).append(`<p>${$(sourceSelector(n), this).text()}</p>`);
});
});
// или
document.addEventListener('click', function({ target: t }) {
if (t = t.closest(itemSelector)) {
keys.forEach((n, i) => this[i].insertAdjacentHTML(
'beforeend',
`<p>${t.querySelector(sourceSelector(n)).textContent}</p>`
));
}
}.bind(keys.map(n => document.querySelector(targetSelector(n)))));
case 'TURN_DONE_POST':
return {
...state,
data: state.data.map(n => n.id === action.payload
? { ...n, done: !n.done }
: n
),
};
phonesProcessed() {
const classes = Object.fromEntries(this.classes.map(({ classinfoName: c, items }) => [
c,
Object.fromEntries(items.map(n => [
n[`id${c[0].toUpperCase()}${c.slice(1)}`],
n.name,
])),
]));
return this.phones.map(n =>
Object.fromEntries(Object.entries(n).map(([ k, v ]) => [
k,
classes.hasOwnProperty(k) ? classes[k][v] : v,
]))
);
},
created() {
[
[ '5ad979f4-7393-11ea-b9b1-d7fe1923484d', 'classinfo', 'classes' ],
[ '46bf408d-739d-11ea-b9b1-5301e3b2b9ba', 'phones', 'phones' ],
].forEach(([ key, apiPropName, componentPropName ]) => {
axios
.get(`https://jsonblob.com/api/${key}`)
.then(({ data: { [apiPropName]: d } }) => this[componentPropName] = d)
.catch(e => this.errors.push(e));
});
},
computed: {
groupedItems() {
const { items } = this;
const statuses = [...new Set(items.map(n => n.status))];
const positions = [...new Set(items.map(n => n.position))];
return items.reduce(
(acc, n) => (acc[n.status][n.position].push(n), acc),
Object.fromEntries(statuses.map(status => [
status,
Object.fromEntries(positions.map(position => [
position,
[]
]))
]))
);
},
},
<ul>
<li v-for="(statusGroup, status) in groupedItems">
<h2>{{ status }}</h2>
<ul>
<li v-for="(positionGroup, position) in statusGroup">
<h3>{{ position }}</h3>
<ul>
<li v-for="n in positionGroup">{{ n.name }}</li>
</ul>
</li>
</ul>
</li>
</ul>
name: 'v-tree',
props: [ 'items' ],
<ul v-if="items instanceof Object">
<li v-for="n in items">
<b>{{ n.name }}</b>
<v-tree :items="n.children" />
</li>
</ul>
const group = (arr, keys) =>
arr.reduce((acc, n) => {
keys.reduce((g, k, i, a) => {
const name = n[k];
return (g[name] = g[name] || {
name,
children: i === a.length - 1 ? [] : {},
}).children;
}, acc).push(n);
return acc;
}, keys.length ? {} : []);
computed: {
groupedItems() {
return group(this.items, [ 'status', 'position' ]);
},
},
<v-tree :items="groupedItems" />
function getGridSize() {
const w = window.innerWidth;
return [ 500, 700, 1225, Infinity ].findIndex(n => n > w) + 1;
}
function getGridSize() {
const w = window.innerWidth;
return [
{ size: 1, maxWidth: 500 },
{ size: 2, maxWidth: 700 },
{ size: 3, maxWidth: 1225 },
{ size: 4, maxWidth: Infinity },
].find(n => n.maxWidth > w).size;
}
const isEqual = (a, b) =>
a.length === b.length && a.every((n, i) => Object.is(n, b[i]));
const includes = (arrs, search) =>
arrs.some(n => isEqual(n, search));
console.log(includes(array, [ 21, 81 ]));
. el.dispatchEvent(new Event('click'));
// или, если обработчик клика висит не на самом svg, а выше
el.dispatchEvent(new Event('click', { bubbles: true }));