Генерация заголовков

Программа с интервалом в 2 сек случайным образом создает 10 заголовков (h1, h2 или h6) и помещает внутрь текст

‘Я заголовок h${n}’.

Важно! Каждый вновь создаваемый заголовок не должен находится выше заголовка с меньшим именем. Т.е. заголовок h3 на странице не может быть выше h2 -

Это полное условие задачи. Вообще не понимаю как это решать кто-то можете полностью весь код написать?

Мои попытки:

let h1 = document.createElement("h1");
let h2 = document.createElement("h2");
let h6 = document.createElement("h6");

let g = setInterval(() => {
  let rand = 0;
  for (let i = 0; i < 10; i++) {
    rand = Math.floor(Math.random() * 3);
  }
  console.log(rand);
}, 2000);

h1.textContent = "hello";
console.log(h1);
console.log(h2);
console.log(h6);

Ответы (1 шт):

Автор решения: ksa

Предложу такой вариант...

function test(n) {
  const t = 'H' + (Math.trunc(Math.random() * 6) + 1)
  const o = document.createElement(t)
  o.textContent = 'Я заголовок №' + n
  const ob = document.querySelector('body')
  const op = [...ob.childNodes].reduceRight((o, e) => {
    if (o) return o
    const val = e.tagName ?? ''
    if (val[0] === 'H' && val <= t) return e
    return null
  }, null)
  if (op) op.after(o)
  else ob.prepend(o)
  if (n++ < 10) setTimeout(test, 1000, n)
}
test(1)

→ Ссылка