.icon {
display: inline-flex;
justify-content: center;
align-items: center;
font-size: 50px;
padding: 0.2em;
width: 1.5em;
height: 1.5em;
border-radius: 100%;
color: #fff;
background: #0f0;
}
.icon::before {
content: attr(data-char);
font-size: 1em;
}<a class="icon" data-char="¶"></a>
<a class="icon" data-char="X"></a>
<a class="icon" data-char="?"></a>const Block = ({ items }) => (
<div className="info">
<ul>{items.map(n => <li>{n}</li>)}</ul>
</div>
);
class App extends React.Component {
state = {
items: [
[ 'hello, world!!', '69' ],
[ 'fuck the world', '187' ],
[ 'fuck everythign', '666' ],
],
selected: null,
}
onClick = e => {
this.setState({
selected: +e.currentTarget.dataset.index,
});
}
render() {
const { items, selected } = this.state;
return (
<div>
<div className="wrap">
{items.map((n, i) => (
<div
className={`wrap__el ${i === selected ? 'active' : ''}`}
onClick={this.onClick}
data-index={i}
>
<Block items={n} />
</div>
))}
</div>
<div className="result">
{selected !== null ? <Block items={items[selected]} /> : null}
</div>
</div>
);
}
}const count1 = [
num => (('' + num).match(/1/g) || []).length,
num => num.toString().replace(/[^1]/g, '').length,
num => `${num}`.split('').filter(d => !~-d).length,
num => [...String(num)].reduce((s, d) => s + (d == 1), 0),
num => ''.split.call(num, 1).length - 1,
];
const numbers = [
23489,
-11,
-93481,
7211231,
0,
123.321,
Infinity,
NaN,
];
count1.map(f => numbers.filter(n => f(n) === 2)).forEach(n => console.log(n));this перед preventDefaults в методе handleDrop.
create: function() { на create: function(e, ui) {.
document.querySelector('.nav__list').addEventListener('click', function(e) {
const sub = e.target.nextElementSibling;
if (sub && sub.classList.contains('nav__sublist')) {
sub.classList.toggle('nav--show');
}
});<input type="date" v-model="years.start">
<input type="date" v-model="years.end">
<div v-for="n in months">
<h3>{{ n.year }}, {{ n.name }}</h3>
<div>{{ n.days }}</div>
</div>data: () => ({
years: {
start: null,
end: null,
},
}),
computed: {
months() {
const start = moment(this.years.start).startOf('month');
const end = moment(this.years.end).endOf('month');
const months = [];
for (; start < end; start.add(1, 'day')) {
const [ year, name, day ] = start.format('YYYY.MMMM.D').split('.');
if (day === '1') {
months.push({
year,
name,
days: [],
});
}
months[months.length - 1].days.push(+day);
}
return months;
},
},отследить появление содержимого блока
array_splice($arr, 2, 0, 'Груши');А если мы не знаем порядковый номер нового элемента, но знаем после какого элемента будет стоять новый, то как быть?
array_splice($arr, array_search('Виноград', $arr) + 1, 0, 'Груши');for (const k in obj) {
obj[k] = Object.values(obj[k]);
}const newObj = Object
.keys(obj)
.reduce((acc, k) => (acc[k] = Object.values(obj[k]), acc), {});
// или
const newObj = Object.fromEntries(Object
.entries(obj)
.map(n => [ n[0], Object.values(n[1]) ])
);const ul = document.querySelector('#ul');
const button = document.querySelector('#but');ul.addEventListener('click', function(e) {
if (e.target.tagName === 'LI') {
e.target.textContent += '!';
}
});
button.addEventListener('click', function() {
const li = document.createElement('li');
li.textContent = `пункт ${ul.children.length + 1}`;
ul.appendChild(li);
});ul.addEventListener('click', ({ target: t }) => t.matches('li') && t.append('!'));
button.addEventListener('click', () => {
ul.insertAdjacentHTML('beforeend', `<li>пункт ${-~ul.children.length}</li>`);
});не срабатывают case, всегда default
.gray {
-webkit-filter: grayscale(100%);
-moz-filter: grayscale(100%);
-o-filter: grayscale(100%);
filter: grayscale(100%);
}map.panes.get('ground').getElement().classList.add('gray');async function processData(data, process, chunkSize, delay) {
let i = -1;
for (const n of data) {
if (++i === chunkSize) {
i = 0;
await new Promise(r => setTimeout(r, delay));
}
process(n);
}
}
processData(Array(10).keys(), console.log, 3, 1500).then(() => console.log('DONE'));