Сергей Соколов

Вероятно, стоит переписать код под NodeJS. Так и так нужно что-то серверное для приёма запроса, возврата результатов.

Но для работы с canvas потребуется именно браузерный движок, поэтому Puppeteer или модуль node-canvas — все подтянут тяжёлый бинарник Chromium под платформу.

new Promise((resolve, reject) => {
  sql.query("SELECT * FROM users", (err, result) => {
    if (err) reject(err);
    else resolve(result);
  });
})
.then((result) => {
  console.log("Result!", result);
})
.catch((err) => console.error(err));

Заменили innerHTML — потеряли элементы, что там были до этого, с их слушателями.

В этой строке

document.querySelector('.show-wrapper').innerHTML = tasks.map...

удаляется элемент кнопки со слушателем. Вставляется новая разметка, с такой же кнопкой, но на которой нет слушателей.

Таймеры щелкают не в классе, где их создали, а в глобальном объекте window – это его методы setTimeout(), setInterval(). Так что удалив какой-то свой объект, таймеры не погасить.
Надо сохранять id созданных таймеров и выключать их через clearTimeout(), clearInterval()

Не меняется, потому, что в JS примитивные типы (число, строка) передаются «по значению». Внутри цикла оказывается копия значения, никак не связанная с оригиналом. Поменять это значение в цикле — оно не изменяется в источнике.

Другое дело объекты – они передаются «по ссылке», и их содержание можно менять:

let a = [{v: 1}, {v: 2}, {v: 3}];
for (let obj of a) {
  obj.v += 1;
}
a // [{"v":2},{"v":3},{"v":4}]

Подробнее про Копирование объектов и ссылки

Свойство childNodes содержит живой NodeList дочерних узлов, не элементов. Первым идёт текстовый узел из пробелов и слова "от". Его-то и надо удалить.

const el = document.querySelector('span.qodef-e-price-value.qodef-e--value');

el.removeChild(el.childNodes[0]);

Букву строки можно получить, обратившись к строке по индексу:
'one'[0] // 'о'

const str = arr.map((word) => word[0]).join(', '); // 'o, t, t'

Из массива слов получается массив букв ['o', 't', 't'],
который склеивается в строку через разделитель запятая+пробел.

Можно заморочиться, арк'ами рисовать бублик:


Как текст рисовать: документация.

Можно без тригонометрии воспользоваться трансформациями canvas.
Двигать точку отсчёта ctx.translate(x, y) и поворачивать на угол ctx.rotate(a).

Набросал пример рисования ломаной штуковины, состоящей из прямых сегментов заданной длины и каждая крутится со своей скоростью:


p.s. Где-то встречалась тема, что концом такой конструкции можно нарисовать абсолютно любую фигуру. Хоть портрет в линиях, хоть подпись. Чем больше колен, тем точнее. Если помните такое — киньте ссылку, пожалуйста.

upd. Нашёл! Видео про комплексный ряд Фурье. Посмотрите, вдохновляет.

По клику получать элемент, его значение, его родительский список.
Определить второй список. В нём найти элемент с таким же значением:

Создать canvas, отрисовать в них картинку, получить из канвы Blob, из него ByteArray.

Примерно так:

const img = document.querySelector("img");

const canvas = document.createElement("canvas");
canvas.width = img.width;
canvas.height = img.height;

const ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0);

canvas.toBlob((blob) => {
  blob.arrayBuffer()
  .then((buf) => {
    // тут как-то отправить эту буффонаду через WebSocket
  })
  .catch(console.error)
  ;

}, "image/png");

★ картинка должна загружаться с того же домена, что и страница, иначе она будет считаться «небезопасной» и не получиться её так прогнать через canvas.

в JavaScript нет таких PHP'шных ассоциативных массивов. Есть объекты. Массив объектов:

var array = [
  {
    'key1': 'value1'
  },
  {
    'key2': 'value2'
  },
  {'key1': 'value1-b'},
  {'key1': 'value1-c'},
]

Массив объектов, в каждом из которых всего по 1 свойству.

Интересуют только те, у которых в наличии свойство с названием из переменной str, и на выходе, видимо, массив значений.

const getValues = (array, key) => array.filter((item) => item.hasOwnProperty(key))
  .map((item) => item[key]);

getValues(array, "key1") // [ "value1", "value1-b", "value1-c" ]

Прописать какую-то дату как начало отсчёта, откуда далее трёхдневными шагами будет идти:

const startDate = new Date(2021, 7, 8); // начало отсчёта
const today = new Date(); // сегодня
const daysPassed = Math.floor((today - startDate) / 864e5);
const future = new Date();
future.setDate(future.getDate() + 3 - daysPassed % 3);

document.querySelector('span.myDate')
  .textContent = new Intl.DateTimeFormat(
    'ru-RU',
    { month: 'long', day: 'numeric' }
  )
  .format(future);

1. через x-bind или :value="xxx"
   
2. selected — точно так же
   

p.s. спасибо за вопрос — раньше не знал про этот фреймворк. Похож на Vue.

class="input-in" vs. ".input-it"

Наверное, не до конца разобрались с циклом for () ?

Хотят попробовать каждую букву слова как центр палиндрома.
От 0 потому, что первая буква имеет индекс 0.
До (не не достигая) s.length – т.к. у последней буквы строки индекс s.length - 1
i++ или i = i + 1 — по одной позиции направо продвигаемся.