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

Не меняется, потому, что в 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 — по одной позиции направо продвигаемся.

По событию "input" отменять предыдущий таймаут, если был, и создавать новый, на 5 секунд.

if (n >= 2) {
  if (step === n) {
    e.classList.remove("d-none")
    e.classList.add("d-block")
  } else {
    e.classList.remove("d-block")
    e.classList.add("d-none")
  }
}

Понадобится переменная, учитывать текущее состояние: сколько шагов уже выбрано.
При клике увеличивать эту переменную на 1. Перебирать все шаги, брать порядковый номер, например, из id "step-XXX".
Сравнивать с текущим значением переменной и добавлять класс, если переменная дотянула уже до текущего.

Раз там дискретно, целыми, то можно по одному литру раскладывать в цикле.
Для массива посчитать «спрос» – сколько в идеале там должно быть (дробные числа).
И на каждой итерации определять самый обездоленный, далёкий от своего идеала, элемент массива – туда класть очередной литр.

function spread(q, volumes) {
  const total = volumes.reduce((a, b) => a + b);
  const result = volumes.slice().fill(0);
  const target = volumes.map((v) => q * v / total);

  while (q--) {
    const demand = result.map((v, i) => target[i] - v);
    const minIndex = demand.indexOf(Math.max(...demand));
    result[minIndex]++;
  }

  return result;
}

spread(4, [1, 10, 3]) // [0, 3, 1]
spread(9, [1, 10, 3]) // [1, 6, 2]
spread(1, [10, 10, 10]) // [1, 0, 0] - слева направо при равных
spread(33, [10, 10, 10]) // [11, 11, 11] - переполняются тоже одинаково

spread(4, [2, 3, 1]) // [ 1, 2, 1 ]
spread(5, [2, 3, 1]) // [ 2, 2, 1 ]
spread(9, [2, 3, 1]) // [ 3, 5, 1 ]

Нужно разбить фразу по пробелу в массив входных слов.
Так же разбить по пробелу в массив строку со словами для поиска.

Найти в первом массиве индексы поисковых слов.

Прочитать про метод массивов splice()
Этим методом удалить элементы, начиная со следующего, после 1-го слова, до 2-го слова index2 - index1 + 1 и заменить его фразой replacement.