const div = document.createElement('div');
div.innerHTML = str;
const arr = Array.from(div.children, n => n.innerText);
const arr = Array.prototype.map.call(
new DOMParser().parseFromString(str, 'text/html').body.children,
n => n.textContent
);
const arr = [];
for (const n of document.createRange().createContextualFragment(str).children) {
arr.push(n.innerHTML);
}
const selector = '.text_size';
const maxlen = 3;
$(selector).text((i, text) => {
return text.length > maxlen ? text.slice(0, maxlen) + '...' : text;
});
const reg = RegExp(`(.{${maxlen}}).+`);
for (const n of document.querySelectorAll(selector)) {
n.textContent = n.textContent.replace(reg, '$1...');
}
<input id="lower" type="number" value="100">
<input id="upper" type="number" value="200">
const lower = document.querySelector('#lower');
const upper = document.querySelector('#upper');
lower.addEventListener('input', function() {
this.value = Math.min(this.value, upper.value);
});
upper.addEventListener('input', function() {
this.value = Math.max(this.value, lower.value);
});
в таблице рекордов (которую заполнял вручную автор по запросам на почту) были люди, выполнившие эту задачу за 1 символ. Вопрос: какой это был символ или как иначе они это сделали?
const random = {
intFromInterval: (min, max) => Math.floor(Math.random() * (max - min)) + min,
intFromZero: (max) => Math.floor(Math.random() * max),
};
console.log(random.intFromInterval(55, 66));
Array.prototype.forEach.call(cards, function(cardDiv) {
// ...
});
for (var i = 0; i < cards.length; i++) {
var cardDiv = cards[i];
// ...
}
$('.button').click(function() {
const $this = $(this);
const $content = $this.closest('.item').find('.block');
if ($this.hasClass('closed')) {
$this.removeClass('closed').html('Скрыть ↑');
$content.slideDown();
} else {
$this.addClass('closed').html('Показать ↓');
$content.slideUp();
}
}).click();
function onClick() {
const color = `#${(Math.random() * 0xFFFFFF | 0).toString(16).padStart(6, 0)}`;
document.querySelectorAll(`.${this.id}`).forEach(n => {
n.style.backgroundColor = color;
});
}
document.querySelectorAll('li').forEach(n => n.addEventListener('click', onClick));
const audio = new Audio();
const queue = [];
audio.onended = function() {
if (queue.length) {
audio.src = queue.shift();
audio.play();
}
};
function play(srcArray) {
queue.push(...srcArray);
if (audio.paused) {
audio.onended();
}
}
play([ '1.mp3', '2.mp3', '3.mp3' ]);
Вешаю на него сеттер...
function test(m) {
let money = m;
Object.defineProperty(this, 'money', {
get() {
return money;
},
set(val) {
alert(`Значение свойства money меняется с ${money} на ${val}`);
money = val;
},
});
}
function test(m) {
this.money = m;
return new Proxy(this, {
set(target, prop, val) {
alert(`Значение свойства ${prop} меняется с ${target[prop]} на ${val}`);
target[prop] = val;
return true;
},
});
}
img
класс лучше переключать у article
- максимально дальних не общих предков картинок. Если вдруг захотите при кликах на кнопки стилизовать ещё что-то помимо картинок, или измените взаимное расположение элементов, то не придётся переписывать js-код. Стили, конечно, придётся немного поправить, вместо .active
будет .active img
.const container = document.querySelector('.container');
const itemSelector = 'article';
const buttonSelector = `${itemSelector} .btn`;
const activeClass = 'active';
container.addEventListener('click', e => {
const button = e.target.closest(buttonSelector);
if (button) {
button.closest(itemSelector).classList.toggle(activeClass);
}
});
container.querySelectorAll(buttonSelector).forEach(function(n) {
n.addEventListener('click', this);
}, e => e.currentTarget.closest(itemSelector).classList.toggle(activeClass));
<div id="container"></div>
const container = document.querySelector('#container');
const text = 'hello, world!!';
const delay = 300;
// можно сразу назначить таймауты для каждого из символов текста
for (const [ i, n ] of Array.prototype.entries.call(text)) {
setTimeout(() => {
container.insertAdjacentHTML('beforeend', `<span>${n}</span>`);
}, 300 * i);
}
// или, назначать следующий таймаут после выполнения предыдущего
(function step(i) {
if (i < text.length) {
const span = document.createElement('span');
span.textContent = text[i];
container.insertAdjacentElement('beforeend', span);
setTimeout(step, delay, i + 1);
}
})(0);
// или, вместо множества таймаутов назначить один интервал
let i = 0;
const intervalId = setInterval(() => {
const span = document.createElement('span');
span.innerText = text[i];
container.append(span);
if (++i >= text.length) {
clearInterval(intervalId);
}
}, delay);
span {
display: inline-block;
animation: span .2s ease-out;
font-size: 40px;
}
@keyframes span {
from {
transform: translateX(500px);
opacity: 0;
}
to {
transform: translateX(0);
opacity: 1;
}
}
arr.sort((a, b) => moment(b.date, 'DD.MM.YY') - moment(a.date, 'DD.MM.YY'));
const newArr = arr
.map(n => [ n, +n.date.split('.').reverse().join('') ])
.sort((a, b) => b[1] - a[1])
.map(n => n[0]);
array[i+1]=true;
array[i+1]=true;
(или array[i+1]=false;
, в зависимости от условия) - массив снова увеличился, опять цикл не завершился, ну и так далее - массив будет жиреть до тех пор, пока станет невозможно выделить ему ещё памяти.const ops = {
OR: arr => arr.some(Boolean),
AND: arr => arr.every(Boolean),
XOR: arr => !!arr.reduce((p, c) => p ^ c, 0),
};
const logicalCalc = (arr, op) => ops[op](arr);
const ops = {
OR(arr) {
for (const n of arr) if (n) {
return true;
}
return false;
},
AND(arr) {
for (const n of arr) if (!n) {
return false;
}
return true;
},
XOR(arr) {
let result = false;
for (const n of arr) if (n) {
result = !result;
}
return result;
},
};
window.name
converts all stored values to their string representations using thetoString
method
Прежде всего мне непонятно зачем происходит сравнение с index.
true
ровно один раз - так как indexOf
возвращает первый индекс, по которому можно найти элемент, равный указанному. То есть, если indexOf
текущего элемента равен текущему индексу, значит элемент встречен впервые, и его надо оставить.